jquery操作iframe的方法:父页面和子页面相互操作的方法

原文出处: http://blog.csdn.net/wanghaoxu1014/article/details/7937634

今天在弄jquery操作iframe中元素:先由iframe中的子页面b.html给外面的父页面a.html页面传值,再将a.html页面计算机的值放到b.html页面上,这里就用到子页面和父页面相互传值,相互调用更自函数这些功能,这里我用一个简单的例子来介绍一下这些方法。

a.html

[html]  view plain  copy
  1. <script language="javascript" src="http://www.aspbc.com/js/jquery.js" type="text/javascript">script>  
  2. <script type="text/javascript">  
  3. function f()  
  4. {  
  5.     $('#a').contents().find("#bbb").val("ddd");   
  6. }  
  7. function fun()  
  8. {  
  9.     alert('弹出子页面调用的函数');  
  10. }  
  11. script>  
  12. <div id="maindiv">testdiv>  
  13. <iframe id="a" name="a" src="b.html" width="600" height="400">iframe><br />  
  14. <input type="button" value="给子页面表单赋值" onclick="f()" />  


 

b.html

[html]  view plain  copy
  1. <script language="javascript" src="http://www.aspbc.com/js/jquery.js" type="text/javascript">script>  
  2. <script type="text/javascript">  
  3. function f()  
  4. {  
  5.     alert('开始调用父页面函数');   
  6.     $(window.parent.fun());  
  7.     $(window.parent.$("#maindiv").html("子页面赋过来的值"));  
  8. }  
  9. script>  
  10. <form name="cform"><input type="text" name="b" id="bbb" /><input name="btn" type="button" onclick="f()" value="调用父函数并给父页面元素赋值" />form>  

你可能感兴趣的:(JavaScript,jQuery,Web)