日期:2014-05-16  浏览次数:20450 次

JS生成DOM里面的file控件,在IEtester的IE8模式下点了没反映
我用的是IE10+chrome,我这反正是没啥问题,IE9也测试没问题,我记得当初用IE8的时候也没出过问题,但是今天去客户那交付的时候,客户的机子上用的IE8就是点了没反映。
我回来以后在IEtester下面检查,果然一样的,但是我在IE10下面的IE8模式里面测试,却是好好的。。。
这个生成上传控件的代码是这样:

var objInput=document.createElement("input");//上传控件
objInput.setAttribute("type","file");
objInput.setAttribute("id","file1");
objInput.setAttribute("name","file1");
objInput.style.position="absolute";
objInput.style.width=65+"px";
objInput.style.top=2+"px";
objInput.style.left=1+"px";
objInput.style.height=27+"px";
objInput.style.opacity=0;
objInput.style.filter="alpha(opacity=0)";
objInput.style.cursor="pointer";
objInput.setAttribute("onchange","GetFileName(this);");


中间样式的那一堆注释掉,就保留前四行和最后一行,也是一样。IEtester下面还不能调试JS,这个太麻烦了,求各位大牛帮分析下,造成这种情况的原因大概在哪?为什么IE10的IE8模式就可以?但是IEtester下面的IE8模式就不行?

------解决方案--------------------
事件绑定不要用setAttribute。。

var objInput=document.createElement("input");//上传控件
objInput.setAttribute("type","file");
objInput.setAttribute("id","file1");
objInput.setAttribute("name","file1");
objInput.style.position="absolute";
objInput.style.width=65+"px";
objInput.style.top=2+"px";
objInput.style.left=1+"px";
objInput.style.height=27+"px";
objInput.style.opacity=0;
objInput.style.filter="alpha(opacity=0)";
objInput.style.cursor="pointer";
objInput.onchange=function(){GetFileName(this);}////////
//objInput.setAttribute("onchange","GetFileName(this);");

------解决方案--------------------


var $input = $("<input style='position:absoute; width:65px; top:2px; left:1px; height:27px; opacity:0; filter:alpha(opacity=0); cursor:pointer;' />");
$input.attr({'type':'file', 'id':'file1', 'name':'file1'});
$input.change(GetFileName(this));
用jquery试试