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 相关文章推荐
基于jquery跨浏览器显示的file上传控件
Oct 24 Javascript
js jq 单击和双击区分示例介绍
Nov 05 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
Feb 02 Javascript
jQuery使用getJSON方法获取json数据完整示例
Sep 13 Javascript
在javascript中,null>=0 为真,null==0却为假,null的值详解
Feb 22 Javascript
JS闭包用法实例分析
Mar 27 Javascript
想用好React的你必须要知道的一些事情
Jul 24 Javascript
JS代码实现电脑配置检测功能
Mar 21 Javascript
vue自定义移动端touch事件之点击、滑动、长按事件
Jul 10 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 jQuery
判断js数据类型的函数实例详解
May 23 Javascript
JavaScript获取当前url路径过程解析
Dec 27 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加MYSQL服务器
2006/10/09 PHP
利用PHP生成静态HTML文档的原理
2012/10/29 PHP
php中AES加密解密的例子小结
2014/02/18 PHP
PHP生成自适应大小的缩略图类及使用方法分享
2014/05/06 PHP
ThinkPHP模板比较标签用法详解
2014/06/30 PHP
PHP对文件进行加锁、解锁实例
2015/01/23 PHP
php对数组内元素进行随机调换的方法
2015/05/12 PHP
CMSPRESS 10行代码搞定 PHP无限级分类2
2018/03/30 PHP
PHP中$GLOBALS与global的区别详解
2019/03/21 PHP
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
jquery的相对父元素和相对文档定位示例代码
2013/08/02 Javascript
jquery实现文本框数量加减功能的例子分享
2014/05/10 Javascript
jquery实现可拖拽弹出层特效
2015/01/04 Javascript
javascript实现10个球随机运动、碰撞实例详解
2015/07/08 Javascript
jQuery实现购物车表单自动结算效果实例
2015/08/10 Javascript
js实现的彩色方块飞舞奇幻效果
2016/01/27 Javascript
JS实现重新加载当前页面或者父页面的几种方法
2016/11/30 Javascript
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
Js中将Long转换成日期格式的实现方法
2018/06/05 Javascript
Angular2中监听数据更新的方法
2018/08/31 Javascript
vue配置nprogress实现页面顶部进度条
2019/09/21 Javascript
[01:02]DOTA2上海特锦赛SHOWOPEN
2016/03/25 DOTA
[01:02:32]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第二场 2月26日
2021/03/11 DOTA
Python tornado队列示例-一个并发web爬虫代码分享
2018/01/09 Python
使用批处理脚本自动生成并上传NuGet包(操作方法)
2019/11/19 Python
python装饰器的特性原理详解
2019/12/25 Python
python 获取计算机的网卡信息
2021/02/18 Python
美国汽车交易网站:Edmunds
2016/08/17 全球购物
英国复古皮包品牌:Beara Beara
2018/07/18 全球购物
联想C++笔试题
2012/06/13 面试题
班组长安全生产职责
2013/12/16 职场文书
运动会横幅标语
2014/06/17 职场文书
毕业典礼致辞
2015/07/29 职场文书
董事长年会致辞
2015/07/29 职场文书
如何利用JavaScript实现二叉搜索树
2021/04/02 Javascript
python实现监听键盘
2021/04/26 Python