动态创建iframe—IE与其他浏览器的不同
2009-11-30 10:33
225 查看
很多情况下,我们都要动态创建元素,比如动态创建iframe,iframe很特殊,它即可以看作是页面元素,也可以看作是窗体对象。所以,所对应的取法也不同。比如当作是页面元素的时候,这样取:document.getElementById('iframe_id'),当作是窗体对象的时候取法就多了,主要有三种:1、window.frames[index] 2、window.frames['iframe_id'] 3、window.frames.iframe_id
这三种取法在IE里都一样,都能正确得到iframe对象,Opera也能正常取出,但惟独FireFox却不好使,不管你用哪种取法总是取不出!开始自己也一直想不通错在了那里,想可能是FireFox浏览器本身的一个Bug,但通过这次项目终于真相大白!
项目要实现这样一个功能,动态创建一个form表单来跨域提交数据,并将form表单的target设置成动态创建的iframe(页面不会跳转到提交的页面)。即:MyForm.target="iframe_name"。那么在创建iframe的时候就要给它赋name属性。问题就出现了,代码如下
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
IframeObj.name = "myfrm";
document.body.appendChild(IframeObj);
</script>
这段代码在FireFox和Opera下都很正常,但在IE下却赋不了name属性!!!
于是我想可能是因为这样写是把它当作了一个页面元素,所以赋不了,那么就它作为一个window对象,然后再赋name属性。代码如下:
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
document.body.appendChild(IframeObj);
window.frames.myfrm.name = "myfrm";
</script>
这样写IE是正常了,可FireFox确又不干了!!!错误提示是window.frames.myfrm没有这个属性???无奈之下只好这么写:
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
frameObj.name = "myfrm";
document.body.appendChild(IframeObj);
window.frames.myfrm.name = "myfrm";
</script>
这样写就一切正常了,于是我得出了这个结论:在FireFox下,取窗体对象是window.frames.frame_name,而不是windwo.frames.frame_id,在没写frameObj.name = "myfrm";这句代码的时候报没有window.frames.myfrm没有这个属性错误就是这个原因。既然window.frames.frame_name可以,那么window.frames[frame_name]和window.frames[index]当然也是可以的!
这三种取法在IE里都一样,都能正确得到iframe对象,Opera也能正常取出,但惟独FireFox却不好使,不管你用哪种取法总是取不出!开始自己也一直想不通错在了那里,想可能是FireFox浏览器本身的一个Bug,但通过这次项目终于真相大白!
项目要实现这样一个功能,动态创建一个form表单来跨域提交数据,并将form表单的target设置成动态创建的iframe(页面不会跳转到提交的页面)。即:MyForm.target="iframe_name"。那么在创建iframe的时候就要给它赋name属性。问题就出现了,代码如下
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
IframeObj.name = "myfrm";
document.body.appendChild(IframeObj);
</script>
这段代码在FireFox和Opera下都很正常,但在IE下却赋不了name属性!!!
于是我想可能是因为这样写是把它当作了一个页面元素,所以赋不了,那么就它作为一个window对象,然后再赋name属性。代码如下:
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
document.body.appendChild(IframeObj);
window.frames.myfrm.name = "myfrm";
</script>
这样写IE是正常了,可FireFox确又不干了!!!错误提示是window.frames.myfrm没有这个属性???无奈之下只好这么写:
<script language="javascript" defer="defer">
var IframeObj = document.createElement("iframe");
IframeObj.id= "myfrm";
IframeObj.width =0;
IframeObj.height =0;
IframeObj.frameborder = 0;
IframeObj.src="about:blank";
frameObj.name = "myfrm";
document.body.appendChild(IframeObj);
window.frames.myfrm.name = "myfrm";
</script>
这样写就一切正常了,于是我得出了这个结论:在FireFox下,取窗体对象是window.frames.frame_name,而不是windwo.frames.frame_id,在没写frameObj.name = "myfrm";这句代码的时候报没有window.frames.myfrm没有这个属性错误就是这个原因。既然window.frames.frame_name可以,那么window.frames[frame_name]和window.frames[index]当然也是可以的!
相关文章推荐
- 获取组件iFrame中的对象(ie和其他浏览器的不同之处)
- 动态添加事件及区分IE和其他浏览器的JS脚本
- IE下,动态创建的iframe在异步提交时会跳转的问题的解决
- IE7下动态创建Iframe时,去除边框
- javascript -- 在IE中如何实现将表单提交给动态创建的iframe
- 在不同浏览器用不同css 解决IE和其他浏览器问题
- margin-top在IE与其他浏览器下的不同
- IE动态创建带name的iframe跳转问题
- IE7下动态创建Iframe时,去除边框
- IE7下动态创建Iframe时,去除边框
- IE、Firefox兼容form target当前页iframe,javascript动态创建表单对象form设置name属性
- 使用Jquery向一个空白网页动态创建一个iframe,及嵌入页面,和向嵌入页面传参
- JavaScript Tip/Trick: 动态创建Table时,在IE中需要注意的一个问题
- IE6 动态创建 iframe 无法显示的 bug--- 芒果
- springboot根据不同的条件创建bean,动态创建bean,@Conditional注解使用
- IE与其他浏览器的区别
- 浅谈IE事件处理与其他浏览器的差异
- 创建ajax对象及解决不同浏览器对XMLHttpRequest对象的兼容问题
- 解决不同浏览器上中文文件名的下载乱码问题php验证可行的测试过ie ff 和chrome的
- [Andriod官方训练教程]使用Fragment创建一个动态的UI之与其他Fragments进行交互