jquery_iframe父子级页面事件使用~

1、index.html

<body topmargin='0' leftmargin='0' style="background:#ccc">　　　　//这里的属性只是为了全屏下边无间隙
　　index.html
    <iframe src="main.html" id="indexMain" style="margin-bottom:-5px;position:relative;"></iframe>　　　　//这里的样式的为了跳转之后移动端input输入完成之后下边无间隙
</body>

<script>
/*父级本页面事件*/
    function oIndexFn(){
            alert("父级页面index.html事件调用成功");
        }
/*调用子页面事件*/
$(document).click(function(){
　　alert("您点击的是父页面[index]")
    $("#indexMain")[0].contentWindow.oMainFn();    //iframe的id
})
</script>

 

 

2、main.html

<body style="background:#f0f0f0">
    main.html
</body>

<script>
/*子级本页面事件*/
    function oMainFn(){
            alert("子页面main.html事件调用成功");
        }
/*调用父页面事件*/
$(document).click(function(){
　　alert("您点击的是子页面！[main]")
    parent.window.oIndexFn();       //调用父级页面事件
})
</script>

 

 

posted @ 2017-11-27 09:52  苏尘尘  阅读(3212)  评论(0)  编辑  收藏  举报