外层页面:
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script language="javascript" src="jquery-1.4.min.js"></script>
<script language="javascript">
<div id="demo">
<input type="button" value="-0-" class="test" id="test">
<iframe src="inner.html" width="100" height="100">
</div>
内层页面
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script language="javascript" src="jquery-1.4.min.js"></script>
<title>Inner</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script>
jQuery(document).ready(function(){
//var c = window.parent.$("#test").val();
//alert(c);
window.$ = window.parent.$;
alert($("#test").val());
var o = parent.document.getElementById("test");
//alert(o.value);
});
</script>
<div id="demo">
INner
</div>
要实现的目标是:内窗口得到外层页面中的id等于test的value值
值得,注意的几点如下:
1。外窗口中,引入的jquery插件的js,在内层必须在引用,否则,内层不能调用到jquery
2。可以通过传统的js调用:
var o = parent.document.getElementById("test");
//alert(o.value);
3。注册内层的$ 为 全局的$
window.$ = window.parent.$;
则可以用常规的方法调用 alert($("#test").val());
4。直接,用:
//var c = window.parent.$("#test").val();
//alert(c);