`

jquery中iframe页面给父页面元素赋值

jquery 
阅读更多

本人第一次发表博文,没有经验写的不好,大家见谅!

本文主要介绍一下jquery中使用iframe标签,如何通过iframe的页面给父页面中的元素赋值功能。

例子：

1、父页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>父页面</title>
    <script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div id="default" style=" width:200px; height:400px; float:left;">default</div>
    <iframe id="iframe" src="b.html" style=" width:500px; height:200px; float:left;"></iframe>
    </div>
    </form>
</body>
</html>

 2、iframe页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>iframe页面</title>
    <script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script>
    <script language="javascript" type="text/javascript">
        function setHtml() {
            //在iframe中给父页面元素赋值
			$('#default', window.parent.document).html("给父页面赋值!");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
	<input type="button" id="button" value="给父页面赋值" onclick="setHtml();"/>
    </form>
</body>
</html>

 ps:在iframe中操作父页面元素的方法是$('#id', window.parent.document) id是父页面中元素的id

 

分享到：
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics