[二]烦透的动态file上传

 

< html >
< head >
< script  type ="text/javascript" > ...

    show_on = function()...{
        var myinput = document.getElementById("myinput");
        
        var ifrm = document.createElement("iframe");
        ifrm.setAttribute("style","width:283px;height:230px;");
        ifrm.setAttribute("scrolling","no");
        ifrm.setAttribute("frameborder","1");
        myinput.appendChild(ifrm);
        ifrm = ifrm.contentWindow.document;
        
        var ifrm_body = ifrm.body;
        
        var ofile = ifrm.createElement("input");
        ifrm_body.appendChild(ofile);

    }

window.onload = show_on;
</ script >
</ head >
< body >
< span  id ="myinput" ></ span >
</ body >
</ html >

动态file上传需要马上创建一个iframe,然后在iframe中添加一个input,在IE中,很轻松就实现了.

轻松在IE中添加,但问题很快就来了..在FF中完全没反应..怎么回事?

原来FF中控制iframe必须用ifm.contentWindow.document.body来添加节点,因为它对空的页面默认添加body节点.所以修改为如下:

< html >
< head >
< script  type ="text/javascript" > ...

    show_on = function()...{
        var myinput = document.getElementById("myinput");
        
        var ifrm = document.createElement("iframe");
        ifrm.setAttribute("style","width:283px;height:230px;");
        ifrm.setAttribute("scrolling","no");
        ifrm.setAttribute("frameborder","1");
        myinput.appendChild(ifrm);
        ifrm = ifrm.contentWindow.document;
        
        var ifrm_body = ifrm.body;
        
        var ofile = ifrm.createElement("input");
        ifrm_body.appendChild(ofile);

    }

window.onload = show_on;
</ script >
</ head >
< body >
< span  id ="myinput" ></ span >
</ body >
</ html >

本来以为成功了,谁知道打开,还是什么都没有..怎么回事?用alert(ifrm_body.innerHTML);发现添加完全正常,发贴到CSDN..有网友说是"消失的生命"..真贴切..

结果在第二天.,某位高人告诉我是FF延迟,通过setTimeout,在其中重新创建对象,加上延迟,结果创建成功了..

< html >
< head >
< script  type ="text/javascript" > ...

    show_on = function()...{
         myinput = document.getElementById("myinput");
        ifrm = document.createElement("iframe");
        ifrm.setAttribute("style","width:283px;height:230px;");
        ifrm.setAttribute("scrolling","no");
        myinput.appendChild(ifrm);
        ifrm_d = ifrm.contentWindow.document;
        var ifrm_body = ifrm_d.body;
        var ofile = ifrm_d.createElement("input");
        ofile.value="asdf";
        ifrm_body.appendChild(ofile);
        
        setTimeout(tt,"20ms");

    }
    
function tt()...{
        ifrm_d = ifrm.contentWindow.document;
      
        var ifrm_body = ifrm_d.body;
        var ofile = ifrm_d.createElement("input");
        ifrm_body.appendChild(ofile);
}

window.onload = show_on;
</ script >
</ head >
< body >
< div  id ="myinput" ></ span >
< input  type ="button"  id ="sd"  onClick ="tt()" >
</ body >
</ html >

神奇在于,把SetTimeout(tt(),0)同样正常运行..

这让我想起了在AJAX中,FF的BUG..

通过SetTimeout( fun,0)能解决许多问题..

下次如果再次出现"消失的生命",可以尝试用SetTimeout方法来解决..