JS 实现获取打开一个界面中输入的值


Posted in Javascript onMarch 19, 2013

需求
在一个界面中打开另一个界面,通过JS获取在另一个界面中用户输入的值。
示例:
Index.html

   <html>
   <head>
     <meta http-equiv="content-type" content="text/html; charset=gbk">
         <title>主页</title>
        <script type="text/javascript">
            function EntryPoint() {
                var style = 'dialogHeight:600px;dialogWidth:800px;status:no;help:0;scrool:yes';
                var a = window.showModalDialog('other.html', '', style);
      
               if (a == undefined) {
                   a = window.returnValue;
               }
              // debugger;
               if (a != null && a.length > 0) {
                   document.getElementById("name").value = a[0];
                   document.getElementById("age").value = a[1];
               }
           }
    </script>
    </head> 
    <body>
    <input type="button" value="调用" onclick="EntryPoint()"/><br/>
    <input type="text" name="name" id="name" /><br/>
    <input type="text" name="age" id="age" />
    </body>
    </html> 

另一个界面:

other.html

  <html>
     <head>
         <title>操作界面</title>
          
         <meta http-equiv="content-type" content="text/html; charset=gbk">
          
        <script type="text/javascript">
            function postValue() {
                var name = document.getElementById("name").value;
               var age = document.getElementById("age").value;
               var a = new Array();
               a[0] = name;
               a[1] = age;
               //debugger;
               if (window.opener != undefined) {
                   //for chrome
                   window.opener.returnValue = a;
               }
               else {
                   window.returnValue = a;
               }
               window.close();
           }
    </script>
    </head> 
    <body>
    <input type="button" value="确定" onclick="postValue();"/><br/>
    名字:<input type="text" name="name" id="name" /><br/>
    年龄:<input type="text" name="age" id="age" />
    </body>
    </html>

在该DEMO中遇到一个问题,那就是chrome中window.close()方法不起作用。最后通过,window.opener来解决chrome和IE的冲突。

Javascript 相关文章推荐
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
js中访问html中iframe的文档对象的代码[IE6,IE7,IE8,FF]
Jan 08 Javascript
JqGrid web打印实现代码
May 31 Javascript
jquery不会自动回收xmlHttpRequest对象 导致了内存溢出
Jun 18 Javascript
JS解析XML文件和XML字符串详解
Apr 17 Javascript
JavaScript中反正弦函数Math.asin()的使用简介
Jun 14 Javascript
js实现简单的联动菜单效果
Aug 19 Javascript
jQuery EasyUI datagrid在翻页以后仍能记录被选中行的实现代码
Aug 15 Javascript
ES6新特性三: Generator(生成器)函数详解
Apr 21 Javascript
VUE2实现事件驱动弹窗示例
Oct 21 Javascript
Javascript数组方法reduce的妙用之处分享
Jun 10 Javascript
JavaScript检测是否开启了控制台(F12调试工具)
Oct 02 Javascript
打开新窗口关闭当前页面不弹出关闭提示js代码
Mar 18 #Javascript
JS+ACTIVEX实现网页选择本地目录路径对话框
Mar 18 #Javascript
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
Mar 18 #Javascript
jquery.blockUI.js上传滚动等待效果实现思路及代码
Mar 18 #Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
Mar 18 #Javascript
JQuery的read函数与js的onload不同方式实现
Mar 18 #Javascript
js前台分页显示后端JAVA数据响应
Mar 18 #Javascript
You might like
递归列出所有文件和目录
2006/10/09 PHP
使用js解决由border属性引起的div宽度问题
2013/11/26 Javascript
js几秒以后倒计时跳转示例
2013/12/26 Javascript
js阻止事件追加的具体实现
2014/10/15 Javascript
jQuery控制网页打印指定区域的方法
2015/04/07 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
Angularjs全局变量被作用域监听的正确姿势
2016/02/06 Javascript
JavaScript编写Chrome扩展实现与浏览器的交互及时间通知
2016/05/16 Javascript
js字符串引用的两种方式(必看)
2016/09/18 Javascript
详解Angular的双向数据绑定(MV-VM)
2016/12/26 Javascript
nodejs服务搭建教程 nodejs访问本地站点文件
2017/04/07 NodeJs
解决JS内存泄露之js对象和dom对象互相引用问题
2017/06/25 Javascript
JS函数节流和防抖之间的区分和实现详解
2019/01/11 Javascript
详解NodeJS Https HSM双向认证实现
2019/03/12 NodeJs
Vue infinite update loop的问题解决
2019/04/23 Javascript
angular4应用中输入的最小值和最大值的方法
2019/05/17 Javascript
layer.prompt使文本框为空的情况下也能点击确定的方法
2019/09/24 Javascript
vue中根据时间戳判断对应的时间(今天 昨天 前天)
2019/12/20 Javascript
JS严格模式原理与用法实例分析
2020/04/27 Javascript
微信小程序实现点赞业务
2021/02/10 Javascript
python中的__slots__使用示例
2015/02/26 Python
windows下Virtualenvwrapper安装教程
2017/12/13 Python
Python3 log10()函数简单用法
2019/02/19 Python
Python实现连接MySql数据库及增删改查操作详解
2019/04/16 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
Python之qq自动发消息的示例代码
2021/02/18 Python
HTML5中的websocket实现直播功能
2018/05/21 HTML / CSS
康帕斯酒店预订:Compass Hospitality(支持中文)
2018/08/23 全球购物
俄罗斯电子产品、计算机和家用电器购物网站:OLDI
2019/10/27 全球购物
历史专业毕业生的自我鉴定
2013/11/15 职场文书
2015年银行个人工作总结
2015/05/14 职场文书
教师调动申请报告
2015/05/18 职场文书
《初涉尘世》读后感3篇
2020/01/10 职场文书
用JS写一个发布订阅模式
2021/11/07 Javascript
python模拟浏览器 使用selenium进入好友QQ空间并留言
2022/04/12 Python
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python