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 相关文章推荐
jQuery 性能优化指南 (1)
May 21 Javascript
JavaScript 原型学习总结
Oct 29 Javascript
javascript学习笔记(九) js对象 设计模式
Jun 19 Javascript
时间戳转换为时间 年月日时间的JS函数
Aug 19 Javascript
jQuery手机浏览器中拖拽动作的艰难性分析
Feb 04 Javascript
HTML5+setCutomValidity()函数验证表单实例分享
Apr 24 Javascript
JQuery中DOM事件合成用法实例分析
Jun 13 Javascript
轻松学习jQuery插件EasyUI EasyUI实现树形网络基本操作(2)
Nov 30 Javascript
Bootstrap精简教程中秋大放送
Sep 15 Javascript
Javascript 正则表达式校验数字的简单实例
Nov 02 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
Oct 16 Javascript
在layui下对元素进行事件绑定的实例
Sep 06 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
通过JavaScript或PHP检测Android设备的代码
2011/03/09 PHP
php cookie名使用点号(句号)会被转换
2014/10/23 PHP
php创建桌面快捷方式实现方法
2015/12/31 PHP
数据结构之利用PHP实现二分搜索树
2020/10/25 PHP
php框架知识点的整理和补充
2021/03/01 PHP
游戏人文件夹程序 ver 4.03
2006/07/14 Javascript
jquery遍历筛选数组的几种方法和遍历解析json对象
2013/12/13 Javascript
JS去除字符串两端空格的简单实例
2013/12/27 Javascript
jquery 按键盘上的enter事件
2014/05/11 Javascript
NodeJS学习笔记之网络编程
2014/08/03 NodeJs
jQuery原理系列-css选择器的简单实现
2016/06/07 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
Node.js中的http请求客户端示例(request client)
2017/05/04 Javascript
Vue的移动端多图上传插件vue-easy-uploader的示例代码
2017/11/27 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
js实现多个倒计时并行 js拼团倒计时
2019/02/25 Javascript
详解用js代码触发dom事件的实现方案
2020/06/10 Javascript
JS JQuery获取data-*属性值方法解析
2020/09/01 jQuery
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
Python实现在Linux系统下更改当前进程运行用户
2015/02/04 Python
python3实现ftp服务功能(服务端 For Linux)
2017/03/24 Python
Python双精度浮点数运算并分行显示操作示例
2017/07/21 Python
django站点管理详解
2017/12/12 Python
Python2.7 实现引入自己写的类方法
2018/04/29 Python
python 借助numpy保存数据为csv格式的实现方法
2018/07/04 Python
Python OpenCV处理图像之滤镜和图像运算
2018/07/10 Python
Python3 Post登录并且保存cookie登录其他页面的方法
2018/12/28 Python
python+os根据文件名自动生成文本
2019/03/21 Python
使用Rasterio读取栅格数据的实例讲解
2019/11/26 Python
python为Django项目上的每个应用程序创建不同的自定义404页面(最佳答案)
2020/03/09 Python
python 实现非极大值抑制算法(Non-maximum suppression, NMS)
2020/10/15 Python
澳大利亚连衣裙和女装在线:Esther
2017/11/11 全球购物
加拿大廉价机票预订网站:CheapOair.ca
2018/03/04 全球购物
舒适的豪华鞋:Taryn Rose
2018/05/03 全球购物
岗位竞聘演讲稿范文
2014/04/24 职场文书
建国70周年的心得体会(2篇)
2019/09/20 职场文书