jquery获取IFRAME框架页面元素值的代码

例子

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

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

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

iframe框架的：

   

在父页面 获取iframe子页面的元素
代码如下:

$("#objid",document.frames('iframename').document)

$(document.getElementById('iframeId').contentWindow.document.body).html()
 
 显示iframe中body元素的内容。

 
$("#testId", document.frames("iframename").document).html();

 根据iframename取得其中ID为"testId"元素

$(window.frames["iframeName"].document).find("#testId").html()

通过JS获取并操作iframe中的元素来解决问题

　　这里主要就是通过JS来操作Window对象。Window 对象表示浏览器中打开的窗口，如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。

　　经过我在网上查资料，找到了JS操作iframe中HTML元素的方法。示例如下。
复制代码

1         function ShowExit() {
2             //获取iframe的window对象
3             var topWin = window.top.document.getElementById("topNav").contentWindow;
4             //通过获取到的window对象操作HTML元素，这和普通页面一样
5             topWin.document.getElementById("exit").style.visibility = "visible";
6         }

复制代码

　　说明：第一步，通过window.top.document.getElementById("topNav")方法获取了顶部菜单页面（topPage.htm）所在的iframe对象；第二步，通过上一步获取到的iframe对象的contentWindow属性得到了iframe中元素所在的window对象；第三步，通过上一步获取到的window对象来操作iframe框架中的元素，这和操作不在iframe框架中的普通HTML元素是一样的。

　　下面是我在重现以及解决这个问题时写的全部代码（布局太丑，但重点是JS方法）：

　　1.使用iframe框架布局的顶级页面（JS操作iframe中的元素.htm）
View Code

　　2.顶部菜单栏页面（topPage.htm）
View Code

　　3.左侧导航栏（leftPage.htm）
View Code

　　4.需要访问顶部菜单页面元素的主页面（mainPage.htm）
View Code

　　5.底部页面（bottomPage.htm）
复制代码

 1
 2
 3
 4    
 5
 6
 7