在线编辑器上传图片问题 请高手进！

Question

本人正在做一个在线编辑器，点击插入图片时，javascript弹出一个新的小页面，选择本地文件，我怎样操作保证当前的这两个页面不消失，又不会出现一个新的页面就能够把刚才选择的本地图片上传到服务器中？　盼高手帮忙，给些正确的思路也行～！！！！！

Answer 1

页面上写<input type='button' width='20' height='20' value="快速添加向导" name='new' onclick="testMessageBox(event);">
之后，JS文件中
var isIe=(document.all)?true:false;
//设置select的可见状态
function setSelectState(state)
{
var objl=document.getElementsByTagName('select');
for(var i=0;i<objl.length;i++)
{
objl[i].style.visibility=state;
}
}
function mousePosition(ev)
{
if(ev.pageX || ev.pageY)
{
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
//弹出方法
function showMessageBox(wTitle,content,pos,wWidth)
{
closeWindow();
var bWidth=parseInt(document.documentElement.scrollWidth);
var bHeight=parseInt(document.documentElement.scrollHeight);
if(isIe){
setSelectState('hidden');}
var back=document.createElement("div");
back.id="back";
var styleStr="top:0px;left:0px;position:absolute;background:#666;width:"+bWidth+"px;height:"+bHeight+"px;";
styleStr+=(isIe)?"filter:alpha(opacity=40);":"opacity:0.40;";
back.style.cssText=styleStr;
document.body.appendChild(back);
var mesW=document.createElement("div");
mesW.id="mesWindow";
mesW.className="mesWindow";
mesW.innerHTML="<div class='mesWindowTop'><table width='100%' height='100%'><tr><td>"+wTitle+"</td><td style='width:1px;'><input type='button' onclick='closeWindow();' title='关闭窗口' class='close' value='关闭' /></td></tr></table></div><div class='mesWindowContent' id='mesWindowContent'>"+content+"</div><div class='mesWindowBottom'></div>";
styleStr="left:"+(((pos.x-wWidth)>0)?(pos.x-wWidth):pos.x)+"px;top:"+(pos.y)+"px;position:absolute;width:"+wWidth+"px;";
mesW.style.cssText=styleStr;
document.body.appendChild(mesW);
}
function showBackground(obj,endInt)
{
obj.filters.alpha.opacity+=1;
if(obj.filters.alpha.opacity<endInt)
{
setTimeout(function(){showBackground(obj,endInt)},8);
}
}
//关闭窗口
function closeWindow()
{
if(document.getElementById('back')!=null)
{
document.getElementById('back').parentNode.removeChild(document.getElementById('back'));
}
if(document.getElementById('mesWindow')!=null)
{
document.getElementById('mesWindow').parentNode.removeChild(document.getElementById('mesWindow'));
}
if(isIe){
setSelectState('');}
}
//测试弹出
function testMessageBox(ev)
{
document.getElementById("add").value=1;
var objPos = mousePosition(ev);
messContent="<form name='form' ID='form' action='shop.php' method='POST'  ENCTYPE='multipart/form-data'><table border='0' style='positio:0  auto;'><tr><td  align='right' ><font color='red'>*</font>商品名：</td><td width='250'><input  size='50' width='250' type='text' name='GoodsName' ></td></tr><tr><td  align='right'><font color='red'>*</font>一口价：</td><td><font color='red' size='5'><input type='text' name='SalePrice'></font>元</td></tr><tr><td align='right'  ><font color='red'>*</font>EMS：</td><td><input type='text' name='EMS' size='5' >元</td></tr><tr><td align='right'><font color='red'>*</font>快递：</td><td><input size='5' type='text' name='Delivery'>元</td></tr><tr><td align='right'style='text-align:bottom' ><font color='red'>*</font>上传图片：</td><td align='left' ><input type='file' name='GoodsPhoto'></td></tr><tr><td align='right'>商品简介：</td><td colspan='2'><textarea name='goodsmsg' cols='48' rows='5'></textarea></td></tr><tr><td align='right'>购买需知：</td><td colspan='2'><textarea name='buymsg' cols='48' rows='5'></textarea></td></tr><tr><td align='right'>联系方式：</td><td colspan='2'><input type='text' name='TEL' size='30'>(常用手机号或座机号)</td></tr><tr><tr><td align='right'>汇款地址：</td><td colspan='2'><textarea name='bank' cols='48' rows='3'></textarea></td><tr><td colspan='2' align= 'middle'><input type='submit' name='edit' align='bottom' value= '确定'></td></tr></table></form> ";
//messContent就是弹出窗口中的信息，你可以做成你想要的样式。
showMessageBox('添加商品',messContent,objPos,510);
}

Answer 2

html 里的 file 不能实现吗文件上传的

Answer 3

你参考一下FCKeditor啊...它的功能刚好就是你说的.而且我也一直在用它.自己改一下还是非常安全的.