100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > js操作iframe兼容各种主流浏览器示例代码【javascript】

js操作iframe兼容各种主流浏览器示例代码【javascript】

时间:2023-06-03 20:03:33

相关推荐

js操作iframe兼容各种主流浏览器示例代码【javascript】

web前端|js教程

iframe,浏览器

web前端-js教程

在做项目时,遇到了操作iframe的相关问题。业务很简单,其实就是在操作iframe内部某个窗体时,调用父窗体的一个函数。于是就写了两个很简单的htm页面用来测试,使用网上流行的方法在谷歌浏览器中始终报错,不能通过。

父页面parent.html的代码如下

仿制互站源码,双系统ubuntu 上网,tomcat之外的服务器,爬虫的后缀,php获取提交表单的ip,seo011lzw

<p>

function ParentFunction() {

alert(ParentFunction);

}

子页面child.html的代码如下

仿秀站网源码,蓝牙键盘连ubuntu,爬虫访问ip限制,php语法->,香河seo优化lzw

<p>

$(document).ready(function () {

$("#btnTest").click(function (e) {

var t=window.parent;

t.ParentFunction();

});

})

rrr

网络上流行的方法 var t=window.parent; t.ParentFunction();在IE中能调用,可是在谷歌浏览器中总是提示如下错误,

Blocked a frame with origin “null” from accessing a frame with origin “null”. Protocols, domains, and ports must match.

网上找了很长时间都没法发现方法,有的也是很早以前的版本,基本上没用了,而且人云亦云,基本上没有测试过。于是自己摸索,后来才发现,谷歌浏览器其实那种方法其实也可以,只是很奇怪,必须发布后才可以,在文件系统中调用,就会出现上边的错误。

其实还有一种html5的方法postMessage,于是就根据着进行了改写,最终代码如下:

父页面parent.html的代码如下

java源码与目标码,vscode必备14个插件,ubuntu 选择更新,tomcat6 401,骷髅爬虫对比,php正则分割字符串,seo技术优化技巧推广渠道,网站上传源码图片,游戏专题模板lzw

<p>

this.ParentFunction= function() {//和注释掉的方法是一样的,也就是说加不加this都是一样的,因为此处的this就是windows

alert(ParentFunction);

}

// function ParentFunction() {

// alert(ParentFunction);

// }

function receiveMessage(e) {

var data = e.data;

if(data=="ParentFunction")

{

ParentFunction() ;

}

}

if (typeof window.addEventListener != undefined) {//使用html5 的postMessage必须处理的

window.addEventListener(message, receiveMessage, false);

} else if (typeof window.attachEvent != undefined) {

window.attachEvent(onmessage, receiveMessage);

}

子页面child.html的代码如下

<p>

$(document).ready(function () {

$("#btnTest").click(function (e) {

var t=window.parent;

if(!t.ParentFunction)//在不支持时,使用html5 的postMessage方法

{

t.postMessage("ParentFunction", *);

}

else

{

t.ParentFunction();

}

});

})

rrr

经过改写后,在文件系统中虽然也会出现那个错误,但需要调用的方法确实调用了,目的确实达到了,不影响使用了。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。