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 相关文章推荐
TextArea 控件的最大长度问题(js json)
Dec 16 Javascript
jquery.fileEveryWhere.js 一个跨浏览器的file显示插件
Oct 24 Javascript
js获取json元素数量的方法
Jan 27 Javascript
javascript实现复选框选中属性
Mar 25 Javascript
AngularJS 中文API参考手册
Jul 28 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
Jan 19 Javascript
js 作用域和变量详解
Feb 16 Javascript
重新理解JavaScript的六种继承方式
Mar 24 Javascript
webpack构建vue项目的详细教程(配置篇)
Jul 17 Javascript
ES6/JavaScript使用技巧分享
Dec 14 Javascript
解决Mac node版本升级失败的问题
May 16 Javascript
JavaScript实现轮播图片完整代码
Mar 07 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
亲密接触PHP之PHP语法学习笔记1
2006/12/17 PHP
PHP取整函数:ceil,floor,round,intval的区别详细解析
2013/08/31 PHP
windows下apache搭建php开发环境
2015/08/27 PHP
yii使用activeFileField控件实现上传文件与图片的方法
2015/12/28 PHP
php base64 编码与解码实例代码
2017/03/21 PHP
PDO::rollBack讲解
2019/01/29 PHP
tp5框架使用cookie加密算法实现登录功能示例
2020/02/10 PHP
JQuery Tab选项卡效果代码改进版
2010/04/01 Javascript
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
2011/10/10 Javascript
JS实现的省份级联实例代码
2013/06/24 Javascript
用Javascript来生成ftp脚本的小例子
2013/07/03 Javascript
javascript删除数组元素并且数组长度减小的简单实例
2014/02/14 Javascript
Javascript基础教程之关键字和保留字汇总
2015/01/18 Javascript
JavaScript数据类型检测代码分享
2015/01/26 Javascript
jQuery UI Bootstrap是什么?
2016/06/17 Javascript
JS实现禁止鼠标右键的功能
2016/10/15 Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
2016/11/09 Javascript
vuejs2.0实现一个简单的分页示例
2017/02/22 Javascript
简单快速的实现js计算器功能
2017/08/17 Javascript
js传递数组参数到后台controller的方法
2018/03/29 Javascript
Js中将Long转换成日期格式的实现方法
2018/06/05 Javascript
解决angular2在双向数据绑定时[(ngModel)]无法使用的问题
2018/09/13 Javascript
vue中使用vue-cli接入融云实现即时通信
2019/04/19 Javascript
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
2020/12/24 Javascript
JavaScript设计模式---单例模式详解【四种基本形式】
2020/05/16 Javascript
深度剖析使用python抓取网页正文的源码
2014/06/11 Python
python游戏地图最短路径求解
2019/01/16 Python
python面试题Python2.x和Python3.x的区别
2019/05/28 Python
pandas DataFrame 交集并集补集的实现
2019/06/24 Python
详解Python在使用JSON时需要注意的编码问题
2019/12/06 Python
英国高街品牌:Miss Selfridge(塞尔弗里奇小姐)
2016/09/21 全球购物
WebSphere面试题:在WebSphere里面如何部署一个应用
2015/08/02 面试题
艺术应用与设计专业个人的自我评价
2013/11/19 职场文书
个性婚礼策划方案
2014/05/17 职场文书
装配车间主任岗位职责
2015/04/08 职场文书
如何计划开一家便利店?
2019/07/31 职场文书