当前位置: 代码迷 >> Web前端 >> jquery 父窗口 子窗口 有关操做
  详细解决方案

jquery 父窗口 子窗口 有关操做

热度:281   发布时间:2012-10-25 10:58:58.0
jquery 父窗口 子窗口 相关操做

<1>?js或者jQuery访问页面中的框架iframe.?
注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下.

?

假设:父窗口? index.html ,有 id 为?subifrm?的 iframe

?

1. 在index.html执行JS直接访问子窗口中某元素 :

Js代码?
  1. document.getElementById('subifrm').contentWindow.document.getElementById('test').style.color='red'??

?

2. 利用jquery 来访问子窗口

Js代码?
  1. $("#subifrm").contents().find("#test").css('color','red');??

====================================================================

====================================================================

?

<2>?用DOM方法与jquery方法结合的方式实现互动操作?

1.在父窗口中操作 选中IFRAME中的所有单选钮

Js代码?
  1. $(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");??

?


2.在IFRAME中操作 选中父窗口中的所有单选钮

Js代码?
  1. $(window.parent.document).find("input[@type='radio']").attr("checked","true");??

====================================================================

====================================================================

?

<3>?使用jquery操作iframe

1 页面里有两个ifame

Js代码?
  1. <iframe?id="leftiframe"></iframe>??
  2. ??
  3. ??
  4. <iframe?id="mainiframe></iframe>??

?

?

leftiframe中jQuery改变mainiframe的src代码:

Js代码?
  1. $("#mainframe",parent.document.body).attr("src","http://www.baidu.com")??
?

?

2、 如果内容里面有一个ID为mainiframe的ifame

Js代码?
  1. <iframe?id="mainifame"></ifame>???
?

ifame包含一个someID

Js代码?
  1. <div?id="someID">you?want?to?get?this?content</div>???

?

得到someID的内容

Js代码?
  1. $("#mainiframe").contents().find("someID").html();或者$("#mainiframe").contains().find("someID").text();??
?

2 、如上面所示?
?? leftiframe中的jQuery操作mainiframe的内容someID的内容

Js代码?
  1. $("#mainframe",parent.document.body).contents().find("someID").html();或者?$("#mainframe",parent.document.body).contents().find("someID").val();??
?

  相关解决方案