父窗口和iframe子窗口之间相互传递参数和调用函数或方法

1.父窗口向子窗口传递参数:

          可以在url中添加参数:2.html?a=1&b=2&c=3

          然后在子页面上可用js解析,提供一个函数:         

function getQueryStr(sArgName)
{
var args = LocString.split("?");
var retval = "";
if(args[0] == LocString) /*参数为空*/
{
return retval; /*无需做任何处理*/
} 
var str = args[1];
args = str.split("&");
for(var i = 0; i < args.length; i ++)
{
str = args[i];
var arg = str.split("=");
if(arg.length <= 1) continue;
if(arg[0] == sArgName) retval = arg[1]; 
}
return retval;
}

      

使用

var a=getQueryStr("a");
var b=getQueryStr("b");
var c=getQueryStr("c");

可以取得值

 

2.子页面向父页面传递参数:

       可以换一个思路也就是在父页面中定义一个变量,然后在子页面中进行访问更改。

        访问方法:window.parent.父窗口中的变量=xxx;

3.父页面调用子窗口方法

     

  <iframe name="myFrame" src="child.html"></iframe> 
               myFrame.window.functionName(); 

4.子窗口调用父窗口方法

        parent.functionName(); 

下面父窗口和子窗口相互调用举例:

    父窗口页面 

<html>  
<head>  
<script   type="text/javascript">  

function say() { 
   alert("parent.html------>I'm at parent.html"); 
   } 

function callChild() 
{  
   //document.frames("myFrame").f1(); 
   myFrame.window.say(); 
}  
</script>  
</head>  
   
<body>    
<input   type=button   value="调用child.html中的函数say()" onclick="callChild()"> 
<iframe name="myFrame" src="child.html"></iframe> 
</body>  
</html>  

子窗口页面 

<html>  
<head>  
<script type="text/javascript"> 
     
function say()  
{  
          alert("child.html--->I'm at child.html");  
} 

function callParent() { 
   parent.say(); 
   } 
</script>  
</head>  
<body>  
<input   type=button   value="调用parent.html中的say()函数"   onclick="callParent()">  
</body>  
</html> 

转载自:http://www.cnblogs.com/hmyprograming/archive/2012/08/15/2640094.html

转载于:https://www.cnblogs.com/baiyunchen/p/3962974.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值