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 相关文章推荐
用javascript父窗口控制只弹出一个子窗口
Apr 10 Javascript
js 关于=+与+=日期函数使用说明(赋值运算符)
Nov 15 Javascript
JS打字效果的动态菜单代码分享
Aug 21 Javascript
详解XMLHttpRequest(一)同步请求和异步请求
Sep 14 Javascript
D3.js实现文本的换行详解
Oct 14 Javascript
用js控件div的滚动条,让它在内容更新时自动滚到底部的实现方法
Oct 27 Javascript
jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】
Mar 15 Javascript
原生js jquery ajax请求以及jsonp的调用方法
Aug 04 jQuery
Angular.js中window.onload(),$(document).ready()的写法浅析
Sep 28 Javascript
Node.js微信 access_token ( jsapi_ticket ) 存取与刷新的示例
Sep 30 Javascript
vue+webpack实现异步组件加载的方法
Feb 03 Javascript
基于mpvue小程序使用echarts画折线图的方法示例
Apr 24 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
phpMyAdmin2.11.6安装配置方法
2008/08/24 PHP
php基于环形链表解决约瑟夫环问题示例
2017/11/07 PHP
php-msf源码详解
2017/12/25 PHP
Laravel 实现在Blade模版中使用全局变量代替路径的例子
2019/10/22 PHP
PHP接入支付宝接口失效流程详解
2020/11/10 PHP
Maps Javascript
2007/01/22 Javascript
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
2008/09/26 Javascript
javascript 24小时弹出一次的代码(利用cookies)
2009/09/03 Javascript
用Juery网页选项卡实现代码
2011/06/13 Javascript
javascript (用setTimeout而非setInterval)
2011/12/28 Javascript
初始Nodejs
2014/11/08 NodeJs
jQuery中click事件用法实例
2014/12/26 Javascript
JavaScript使用concat连接数组的方法
2015/04/06 Javascript
基于JavaScript实现根据手机定位获取当前具体位置(X省X市X县X街道X号)
2015/12/29 Javascript
JS基于ocanvas插件实现的简单画板效果代码(附demo源码下载)
2016/04/05 Javascript
全面解析Javascript无限添加QQ好友原理
2016/06/15 Javascript
原生js实现无缝轮播图效果
2017/01/11 Javascript
jQuery Plupload上传插件的使用
2017/04/19 jQuery
Node.js使用orm2进行update操作时关联字段无法修改的解决方法
2017/06/13 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
使用vue-cli+webpack搭建vue开发环境的方法
2017/12/22 Javascript
vue实现压缩图片预览并上传功能(promise封装)
2019/01/10 Javascript
Vue-cli assets SubDirectory及PublicPath区别详解
2020/08/18 Javascript
vue自定义指令限制输入框输入值的步骤与完整代码
2020/08/30 Javascript
[04:36]DOTA2国际邀请赛 ti3精彩集锦
2013/08/19 DOTA
SQLite3中文编码 Python的实现
2017/01/11 Python
Python在信息学竞赛中的运用及Python的基本用法(详解)
2017/08/15 Python
Python环境搭建之OpenCV的步骤方法
2017/10/20 Python
Python将视频或者动态图gif逐帧保存为图片的方法
2019/09/10 Python
用Python开发app后端有优势吗
2020/06/29 Python
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
2012/12/09 HTML / CSS
全球知名鞋履品牌授权零售商:Journeys
2016/09/17 全球购物
Napapijri西班牙在线商店:夹克、外套、运动衫等
2020/11/05 全球购物
假面舞会策划方案
2014/05/29 职场文书
班主任寄语2016
2015/12/04 职场文书
全网非常详细的pytest配置文件
2022/07/15 Python