JavaScript弹出窗口并回填父窗口参数的两种方式

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/William0318/article/details/53643320

一、模式对话框 window.showModalDialog

1. 参数设置

 http://blog.csdn.net/bobwu/article/details/7474703(带实例)

2. 模式对话框用法:

 主窗口:var value =window.showModalDialog(‘test.jsp’,strs,’resizable:yes’);
弹出框中通过window.returnValue来设置返回值,上面的value拿到的就是这个值,然后主窗口中可以对
这个值进行处理,实现交互处理。
注:模式对话框的应用就在于它的返回值,可以返回简单字符窜,也可以返回数组,非模式对话框类似

二、window.open() 方法

1. 参数设置

 http://blog.csdn.net/zsy5606666/article/details/7755868
 http://www.runoob.com/jsref/met-win-open.html
 

2. 具体实例

 (1)父窗口

<script> 
function show_child() 
{ 
var child=window .open("child.html","child","height=200,width=400,status=yes,toolbar=no,menubar=no,location=no"); 
/* if(!child.closed) 
{ 
if(!window .close()) 
{ 
var textValue = frm.txt.value; parent.frm0.txt0.value = textValue; 
} 
else 
{ 
window .close(); 
child.close(); 
} 
}*/ 
} 
</script> 
<a href="javascript:show_child();">打开子窗口</a> 
<form name=frm0> 
<input type="text" name="txt0" id="txt0"> //注意这里一定要写ID属性不然FF下取不到值 
</form> 

 (2)子窗口

<script> 
function choseItem() 
{ 
var v=""; 
var check_item = document.frm.item; 
for(i=0;i<check_item.length;i++) 
{ 
if(check_item[i].checked) 
{ 
v+=","+check_item[i].value; 
} 
document.frm.txt.value=v.replace(/^,{1}/,""); 
} 
} 
function foo() 
{ 
window .close(); 
window .opener.document.getElementById("txt0").value=document.getElementById("txt").value 
} 
</script> 
<body> 
<form name=frm> 
<input type=checkbox name=item value=1 onclick="choseItem();">a 
<input type=checkbox name=item value=2 onclick="choseItem();">b 
<input type=checkbox name=item value=3 onclick="choseItem();">c 
<input type=checkbox name=item value=4 onclick="choseItem();">d 
<input type=text name="txt" id="txt"> 
</form> 
<input type=button value="关闭" onclick="foo();"> 
</body> 
展开阅读全文

没有更多推荐了,返回首页