THML IFRAME框架 各个子页面间操作

各个frame之间操作，尤其是父子之间的frame之间的可以任意操作对方页面中的元素，这是个激动的事！

比如当一个学生注册的时候，可以选择注册的班级，我们可以弹出一个DIALOG供选择，如果学校班级很多 好几千，当然我们可以通过ajax的方式供对方选择，这也是现在常用的。但同意可以通过弹出个iframe，而iframe专门负责选择班级，并且添加了分页搜索等功能，这样就可以把不同功能的代码在不同的页面，用传统的方式解决ajax问题。最后再把用户选择的传回父页面，OK了。

谷歌搜索：html frame操作  jquery html frame操作

推荐博文：

http://hi.baidu.com/abcfxr/blog/item/ee82f063f414bfd1e7113a0b.html

http://jhxk.iteye.com/blog/458568

http://www.cnblogs.com/xyicheng/archive/2010/02/26/1674017.html

JQUERY IFRAME

下面简单使用Jquery来操作iframe的一些记录，这个使用纯JS与可以实现。

第一、在iframe中查找父页面元素的方法：
$('#id', window.parent.document)

第二、在父页面中获取iframe中的元素方法：
$(this).contents().find("#suggestBox")

第三、在iframe中调用父页面中定义的方法和变量：
parent.method
parent.value

 

iframe里用jquery获取父页面body

iframe.html

<html>
<script src='jquerymin.js'>
</script>
<body id='1'>
    <div>it is a iframe</div>
</body>    
<script>
    $(document).ready(
        function()
        {
            var c = $(window.parent.document.body) //麻烦的方法： var c = $($(window).eq(0)[0].parent.document).find('body'); ，忘了可以用前面的方法了
            alert(c.html());
        }
    );
</script>
</html>

content.html

<html>
    <script src='jquerymin.js'>
</script>
<body id='fa'>
    <iframe src='iframe.html' width='100' height='100'></iframe>
    <br>
        <br>
            <br>
            <div id='mydiv'>content iframe</div>
</body>    
<script>
    function a()
    {
        alert(1);
    }
    alert($(document).text());
    </script>
</html>

posted @ 2011-06-10 20:51  BuildNewApp  阅读(819)  评论(0)  编辑  收藏  举报