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中获取select选中值的代码
Jun 27 Javascript
JS防止用户多次提交的简单代码
Aug 01 Javascript
JS批量操作CSS属性详细解析
Dec 16 Javascript
jQuery动态修改超链接地址的方法
Feb 13 Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
Dec 13 Javascript
简述jQuery ajax的执行顺序
Jan 05 Javascript
JavaScript黑洞数字之运算路线查找算法(递归算法)实例
Jan 28 Javascript
jQuery.form插件的使用及跨域异步上传文件
Apr 27 Javascript
JS 实现可停顿的垂直滚动实例代码
Nov 23 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
vue实现类似淘宝商品评价页面星级评价及上传多张图片功能
Oct 29 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 feof用来识别文件末尾字符的方法
2010/08/01 PHP
PHP使用GIFEncoder类处理gif图片实例
2014/07/01 PHP
详谈配置phpstorm完美支持Codeigniter(CI)代码自动完成(代码提示)
2017/04/07 PHP
php注册审核重点解析(数据访问)
2017/05/23 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
JQuery AJAX 中文乱码问题解决
2013/06/05 Javascript
动态获取复选框checkbox选中个数的jquery代码
2013/06/25 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
jquery.validate使用时遇到的问题
2015/05/25 Javascript
JSON字符串和对象相互转换实例分析
2016/06/16 Javascript
JavaScript 节流函数 Throttle 详解
2016/07/04 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
2017/11/28 Javascript
AngularJs点击状态值改变背景色的实例
2017/12/18 Javascript
Vue2.0实现调用摄像头进行拍照功能 exif.js实现图片上传功能
2018/04/28 Javascript
详解js的视频和音频采集
2018/08/09 Javascript
基于vue实现移动端圆形旋钮插件效果
2018/11/28 Javascript
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
2019/02/27 jQuery
[05:43]VG.R战队教练Mikasa专访:为目标从未停止战斗
2016/08/02 DOTA
实例Python处理XML文件的方法
2015/08/31 Python
解读! Python在人工智能中的作用
2017/11/14 Python
Python日期时间模块datetime详解与Python 日期时间的比较,计算实例代码
2018/09/14 Python
python添加菜单图文讲解
2019/06/04 Python
python获取地震信息 微信实时推送
2019/06/18 Python
python实现图片横向和纵向拼接
2020/03/05 Python
django 利用Q对象与F对象进行查询的实现
2020/05/15 Python
Python3爬虫中Ajax的用法
2020/07/10 Python
浅谈python处理json和redis hash的坑
2020/07/16 Python
python 5个实用的技巧
2020/09/27 Python
Python通过fnmatch模块实现文件名匹配
2020/09/30 Python
python利用xlsxwriter模块 操作 Excel
2020/10/14 Python
html5 Canvas画图教程(10)—把面拆成线条模拟出圆角矩形
2013/01/09 HTML / CSS
HTML5制作酷炫音频播放器插件图文教程
2014/12/30 HTML / CSS
html5响应式开发自动计算fontSize的方法
2020/01/13 HTML / CSS
毕业论文致谢信
2015/05/14 职场文书
react如何快速设置文件路径别名
2021/04/28 Javascript
numpy array找出符合条件的数并赋值的示例代码
2022/06/01 Python