⑴ iframe怎么通过js修改子页面的内容
1、iframe子页面调用父页面js函数
子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数,就写成:
代码如下:
window.parent.a();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
代码如下:
window.parent.document.getElementById("test").value;
jQuery方法为:
$(window.parent.document).contents().find("test").val();
但是我在chrome浏览器下却发现此方法无效了!查了半天才了解,在chrome 5+中,window.parent无法在file://协议中运行,但是发布了之后http://协议下是可以运行的。此方法支持ie、firefox浏览器。
2、iframe父页面调用子页面js函数
代码如下:
这个就稍微复杂一些,下面的方法支持ie和firefox浏览器:
document.getElementById('ifrtest').contentWindow.b();
子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
document.getElementById("test").value;
注:ifrtest是iframe框架的id,b()为子页面js函数。contentWindow属性是指定的frame或者iframe所在的window对象,IE下可以省略。
⑵ jquery,iframe,如何在父窗口监听,子窗口发生改变时,父窗口获取子窗口的值
①jquery在父页面 获取iframe子页面的元素
代码如下:(objid为子页面的id)
$("#objid",document.frames('iframename').document)
②js 在父页面获取iframe子页面元素代码如下:
window.frames["iframe_ID"].document.getElementByIdx_x("元素id");
以上两种都能获取到子页面中的元素,再根据元素去获取元素的值就可以了。
⑶ iframe 父页面调用子页面方法
iframe 父页面调用子页面方法:
parent.frames["frameName"].window.functionName();
frameName:IFrame的ID;
funtionName:子页面中JS方法名;
var obj = parent.frames["frameName"].window;
在父页面访问子页面中某个控件如:obj.document.getElementByIdx_x('clientID')
子页面刷新父页面:top.window.location.replace(Url);
⑷ 如何利用jquery插件来操作iframe子级页面的元素
结合当前非常流行的 jquery 分享一下如何使用 jquery 查找和操作 iframe 父级页面元素的实现代码。实例如下:
XML/HTML Code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>父级页面</title>
</head>
<body>
<div id="example">这是父级页面!</div>
<div>
<iframe src="iframe.html"></iframe>
</div>
</body>
</html>
下面是 iframe.html 页面代码:
XML/HTML Code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iframe 子级页面</title>
<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script language="javascript">
$("body",parent.document).append('这是子级页面添加的内容!');
$("body",parent.document).find('#example').html('子级页面将替换父级页面的内容!');
</script>
</head>
<body>
iframe 子级页面内容
</body>
</html>
另外由于 iframe 不能跨域,所以直接打开以上文件的话,有的浏览器可能不起作用,这时可以将以上两文件上传到本地或远程服务器上看效果。
另外对于javascript操作iframe对象有几点需要说明的是:
iframe里的js要操作父级窗口的dom,必须搞懂几个对象:
parent是父窗口(如果窗口是顶级窗口,那么parent==self==top),
top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),
self是当前窗口(等价window),
opener是用open方法打开当前窗口的那个窗口;
这样iframe里的js要操作父级窗口的dom可以通过parent,top这些对象来获取父窗口的window对象,例如:
parent.document.getElementById("dom ID");
parent,top还能调用父级窗口的的js方法,比如,getIFrameDOM(iID)是父级窗口的一个方法,那么iframe里可以使用parent.getIFrameDOM("wIframeA")来调用父级窗口的getIFrameDOM(iID)方法。
⑸ iframe 子页面JS如何调用父页面全局变量
1、在父页面访问Iframe子窗体的txtAddress控件
window.frames["ifrMapCompanyDetails"].document.all("txtAddress").value = '地址' ;
2、在Iframe子窗体1访问父页面的TextBox1控件 , 子窗体1把值赋给子窗体2的某个控件
string strValue = "从子窗体传递给父页面的值" ;
下面是在Page_Load事件里面调用的,当然可以写在javascript脚本里面
this.Response.Write("<script>parent.document.all('TextBox1').value = '" + strValue + "';</script>");
this.Response.Write("<script>if( parent.document.all('TextBox2').value = '0')parent.document.all('TextBox1').value = '44';</script>");
3、子窗体访问父窗体中的全局变量:
parent.xxx;
4、在Iframe子窗体1访问子窗体2的txtAddress控件 子窗体1把值赋给子窗体2的某个控件
window.parent.frames["ifrMapCompanyDetails"].document.all("txtAddress").value = '地址' ;
父窗体提交两个Iframe子窗体
window.frames["ifrMapCompanyDetails"].Form1.submit();
window.frames["ifrMapProctInfoDetails"].Form1.submit();
Iframe子窗体 调用父页面的javascript事件
window.parent.XXX()
//父页面调用当前页面中IFRAME子页面中的脚本childEvent
function invokechildEvent()
{ var frm = document.frames["ifrChild1"].childEvent(); }
或者调用当前页面中第一个IFRAME中的脚本childEvent
{ var frm = document.frames[0]; frm.childEvent(); }
//子页面调用父窗体的某个按钮的按钮事件
window.parent.Form1.btnParent.click()
父页面调用子窗体的某个按钮的按钮事件
window.frames['ifrChild1'].document.all.item("btnChild3").click();
//jquery 部分:
1.在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");
2.在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input[@type='radio']").attr("checked","true");
⑹ iframe包含页面如何引用父级页面的js文件(注意不是某个方法)
如果父级页面的域名是
www..com
子级域名是
ued..com
可以如下:两个页面都设置document.domain
=
"xxx.com";注意不要带有www如果不是主域名和子域名关系的话,那么就没有太好的办法了,这牵扯到跨域问题了~