600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > html中加载页面时调用函数 iframe中嵌套html页面中的js调用外层w页面的js方法

html中加载页面时调用函数 iframe中嵌套html页面中的js调用外层w页面的js方法

时间:2021-10-12 10:33:44

相关推荐

html中加载页面时调用函数 iframe中嵌套html页面中的js调用外层w页面的js方法

var ifr = this.getElementByXid("iframeXid").contentWindow;//取得子页面的窗口

var img = ifr.document.getElementById("bkbjImg");//取得子页面中要操作的dom元素

img.src = "img/bkbjRed.gif";//更新元素的src属性值

二、iframe中的js访问外层w的js方法以map为例,如下:

1、在调用map.html的父窗口mapActivity.w中,随便加一个div,方便调用。源码如下:

2、在调用map.html的父窗口mapActivity.js中,随便加一个函数,为了测试。源码如下:

Model.prototype.test = function(data){

alert(data.a);

};

3、在map.html文件中,在想调用父窗口的地方加入如下代码:

var partenW = window.parent;

var parentDiv = partenW.document.getElementById(‘ContextForId’); //父窗口中定义的div

var parentModel = partenW.justep.Util.getModel(parentDiv);

parentModel.test({a:123}); //父窗口model中定义的函数

4、调用ok!

三、如果iframe 内部的页面想跨域访问外层window的corodva插件方法

针对跨域的iframe,由于使用parent.xxxx();或者top.xxxx();直接报跨域的错误,所以需要借助html5的消息通讯机制(postMessage)。内层、外层的页面都监听message事件,再iframe内部点击按钮需要调用插件时,直接发送消息到外层页面上,外层页面接收到消息后调用插件,完成后把插件返回的数据作为参数再发送到iframe内页中,就可以实现跨域情况下iframe内页调用插件的情况。

注意:调用w页面的js方法,一定要保证w页面先加载完毕,父窗口中定义的div被KO绑定后,才可以获取到parentModel,所以尽量不要onload事件中调用(如果非要如此,请延时一小会儿)

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