Js 弹出框口并返回值的两种常用方法
时间：2021-04-19 08:06:19|栏目：JavaScript代码|点击： 次
1.window.showModalDialog(url,args,dialogattrs)
参数说明：
url:弹出页面地址
agrs：主窗口传给对话框的参数，可以是任意类型（数组也可以）
dialogattrs：弹出窗口的样式参数
模式对话框用法：
主窗口：var value =window.showModalDialog('test.jsp',strs,'resizable:yes');
弹出框中通过window.returnValue来设置返回值，上面的value拿到的就是这个值，然后主窗口中可以对
这个值进行处理，实现交互处理
注：模式对话框的应用就在于它的返回值，可以返回简单字符窜，也可以返回数组，非模式对话框类似
2。window.open:
【父窗口】
<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>
【子窗口】
<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>
小结：一般情况下，windows.open因为自定义的比较多，所以用windows.open的较多，上面的很多网页编辑器喜欢用showModalDialog,实在不知道用哪个的的，就用window.open吧，很多成熟的cms系统都是用的window.open.
参数说明：
url:弹出页面地址
agrs：主窗口传给对话框的参数，可以是任意类型（数组也可以）
dialogattrs：弹出窗口的样式参数
模式对话框用法：
主窗口：var value =window.showModalDialog('test.jsp',strs,'resizable:yes');
弹出框中通过window.returnValue来设置返回值，上面的value拿到的就是这个值，然后主窗口中可以对
这个值进行处理，实现交互处理
注：模式对话框的应用就在于它的返回值，可以返回简单字符窜，也可以返回数组，非模式对话框类似
2。window.open:
【父窗口】
复制代码 代码如下:
<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>
【子窗口】
复制代码 代码如下:
<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>
小结：一般情况下，windows.open因为自定义的比较多，所以用windows.open的较多，上面的很多网页编辑器喜欢用showModalDialog,实在不知道用哪个的的，就用window.open吧，很多成熟的cms系统都是用的window.open.
上一篇：鼠标放在放在输入框上面提示效果
栏 目：JavaScript代码
本文标题：Js 弹出框口并返回值的两种常用方法
本文地址：http://www.codeinn.net/misctech/104254.html
