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,水平有待提高
Jan 31 Javascript
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
Sep 03 Javascript
js判断选择的时间是否大于今天的代码
Aug 20 Javascript
AngularJs+Bootstrap实现漂亮的计算器
Aug 10 Javascript
javascript兼容性(实例讲解)
Aug 15 Javascript
vue axios 给生产环境和发布环境配置不同的接口地址(推荐)
May 08 Javascript
详解node Async/Await 更好的异步编程解决方案
May 10 Javascript
jQuery+PHP实现上传裁剪图片
Jun 29 jQuery
Vue中遍历数组的新方法实例详解
Jul 21 Javascript
详解Vuex下Store的模块化拆分实践
Jul 31 Javascript
js实现消灭星星(web简易版)
Mar 24 Javascript
你不知道的 TypeScript 高级类型(小结)
Aug 28 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
全国FM电台频率大全 - 6 辽宁省
2020/03/11 无线电
PHP实现简单ajax Loading加载功能示例
2016/12/28 PHP
Ubuntu 16.04中Laravel5.4升级到5.6的步骤
2018/12/07 PHP
从零开始学习jQuery (二) 万能的选择器
2010/10/01 Javascript
基于Jquery实现表格动态分页实现代码
2011/06/21 Javascript
JavaScript移除数组元素减少长度的方法
2013/09/05 Javascript
replace()方法查找字符使用示例
2013/10/28 Javascript
jquery 合并内容相同的单元格(示例代码)
2013/12/13 Javascript
javascript替换已有元素replaceChild()使用介绍
2014/04/03 Javascript
简介JavaScript中的setDate()方法的使用
2015/06/11 Javascript
JavaScript实战(原生range和自定义特效)简单实例
2016/08/21 Javascript
Nodejs+Socket.io实现通讯实例代码
2017/02/13 NodeJs
微信小程序 滚动到某个位置添加class效果实现代码
2017/04/19 Javascript
JS简单实现父子窗口传值功能示例【未使用iframe框架】
2017/09/20 Javascript
JS实现点击复选框变更DIV显示状态的示例代码
2017/12/18 Javascript
vue中如何使用ztree
2018/02/06 Javascript
Nodejs异步回调之异常处理实例分析
2018/06/22 NodeJs
JS/HTML5游戏常用算法之追踪算法实例详解
2018/12/12 Javascript
微信小程序按顺序同步执行的两种方式
2019/12/20 Javascript
Vue.js暴露方法给WebView的使用操作
2020/09/07 Javascript
[53:52]OG vs EG 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
Django 生成登陆验证码代码分享
2017/12/12 Python
Python数据结构与算法之字典树实现方法示例
2017/12/13 Python
Sanic框架安装与简单入门示例
2018/07/16 Python
对python的bytes类型数据split分割切片方法
2018/12/04 Python
python原类、类的创建过程与方法详解
2019/07/19 Python
python获取Pandas列名的几种方法
2019/08/07 Python
解决python 读取excel时 日期变成数字并加.0的问题
2019/10/08 Python
pip安装提示Twisted错误问题(Python3.6.4安装Twisted错误)
2020/05/09 Python
用HTML5.0制作网页的教程
2010/05/30 HTML / CSS
ManoMano英国:欧洲第一家专注于DIY和园艺市场的电商平台
2020/03/12 全球购物
《胖乎乎的小手》教学反思
2014/02/26 职场文书
软件项目开发计划书
2014/05/01 职场文书
大气污染防治方案
2014/05/19 职场文书
共青团员自我评价
2015/03/10 职场文书
JS前端轻量fabric.js系列物体基类
2022/08/05 Javascript