Js 弹出框口并返回值的两种常用方法


Posted in Javascript onDecember 30, 2010

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.
Javascript 相关文章推荐
JS函数验证总结(方便js客户端输入验证)
Oct 29 Javascript
Javascript图像处理—为矩阵添加常用方法
Dec 27 Javascript
框架页面高度自动刷新的Javascript脚本
Nov 01 Javascript
JQuery勾选指定name的复选框集合并显示的方法
May 18 Javascript
JQuery包裹DOM节点的方法
Jun 11 Javascript
JS实现黑色风格的网页TAB选项卡效果代码
Oct 09 Javascript
jQuery绑定事件的四种方式介绍
Oct 31 Javascript
理解javascript中的闭包
Jan 11 Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 Javascript
JavaScript利用fetch实现异步请求的方法实例
Jul 26 Javascript
详解AngularJS跨页面传值(ui-router)
Aug 23 Javascript
解决layer.confirm选择完之后消息框不消失的问题
Sep 16 Javascript
JavaScript之appendChild、insertBefore和insertAfter使用说明
Dec 30 #Javascript
Javascript事件热键兼容ie|firefox
Dec 30 #Javascript
某人初学javascript的时候写的学习笔记
Dec 30 #Javascript
Javascript延迟执行实现方法(setTimeout)
Dec 30 #Javascript
JavaScript的document对象和window对象详解
Dec 30 #Javascript
javascript hashtable 修正版 下载
Dec 30 #Javascript
javascript中运用闭包和自执行函数解决大量的全局变量问题
Dec 30 #Javascript
You might like
Php Cookie的一个使用注意点
2008/11/08 PHP
PHP 超链接 抓取实现代码
2009/06/29 PHP
PHP图片裁剪函数(保持图像不变形)
2014/05/04 PHP
教你识别简单的免查杀PHP后门
2015/09/13 PHP
windows8.1下Apache+Php+MySQL配置步骤
2015/10/30 PHP
PHP面向对象程序设计之对象生成方法详解
2016/12/02 PHP
javascript 获取网页标题代码实例
2014/01/22 Javascript
Node.js开源应用框架HapiJS介绍
2015/01/14 Javascript
js使用html2canvas实现屏幕截取的示例代码
2017/08/28 Javascript
js实时监控文本框输入字数的实例代码
2018/01/18 Javascript
详解在Vue中使用TypeScript的一些思考(实践)
2018/07/06 Javascript
微信小程序实现获取小程序码和二维码java接口开发
2019/03/29 Javascript
JS轮播图的实现方法2
2020/08/25 Javascript
Vue+penlayers实现多边形绘制及展示
2020/12/24 Vue.js
[04:00]DOTA2解说界神雕侠侣 CJ第四天谷子现场过生日
2013/07/30 DOTA
Python获取网页上图片下载地址的方法
2015/03/11 Python
Python实现给文件添加内容及得到文件信息的方法
2015/05/28 Python
使用python的turtle绘画滑稽脸实例
2019/11/21 Python
python pptx复制指定页的ppt教程
2020/02/14 Python
离线状态下在jupyter notebook中使用plotly实例
2020/04/24 Python
django 模型字段设置默认值代码
2020/07/15 Python
Python常用扩展插件使用教程解析
2020/11/02 Python
前后端结合实现amazeUI分页效果
2020/08/21 HTML / CSS
大学生自荐书范文
2013/12/10 职场文书
装修五一活动策划案
2014/01/23 职场文书
小学毕业感言150字
2014/02/05 职场文书
创建省级文明单位实施方案
2014/02/27 职场文书
大学生会计职业生涯规划范文
2014/02/28 职场文书
家长建议怎么写
2014/05/15 职场文书
大学生学雷锋活动总结
2014/06/26 职场文书
党员教师四风自我剖析材料
2014/09/30 职场文书
个性与发展自我评价
2015/03/06 职场文书
社区文明倡议书
2015/04/28 职场文书
初中同学会致辞
2015/08/01 职场文书
三年级作文之小小梦想
2019/12/06 职场文书
Java基于字符界面的简易收银台
2021/06/26 Java/Android