需求
在一个界面中打开另一个界面,通过JS获取在另一个界面中用户输入的值。
示例:
Index.html
1: <html>
2: <head>
3: <meta http-equiv="content-type" content="text/html; charset=gbk">
4: <title>主页</title>
5: <script type="text/javascript">
6: function EntryPoint() {
7: var style = 'dialogHeight:600px;dialogWidth:800px;status:no;help:0;scrool:yes';
8: var a = window.showModalDialog('other.html', '', style);
9:
10: if (a == undefined) {
11: a = window.returnValue;
12: }
13: // debugger;
14: if (a != null && a.length > 0) {
15: document.getElementById("name").value = a[0];
16: document.getElementById("age").value = a[1];
17: }
18: }
19: </script>
20: </head>
21: <body>
22: <input type="button" value="调用" onclick="EntryPoint()"/><br/>
23: <input type="text" name="name" id="name" /><br/>
24: <input type="text" name="age" id="age" />
25: </body>
26: </html>
另一个界面:
other.html
1: <html>
2: <head>
3: <title>操作界面</title>
4:
5: <meta http-equiv="content-type" content="text/html; charset=gbk">
6:
7: <script type="text/javascript">
8: function postValue() {
9: var name = document.getElementById("name").value;
10: var age = document.getElementById("age").value;
11: var a = new Array();
12: a[0] = name;
13: a[1] = age;
14: //debugger;
15: if (window.opener != undefined) {
16: //for chrome
17: window.opener.returnValue = a;
18: }
19: else {
20: window.returnValue = a;
21: }
22: window.close();
23: }
24: </script>
25: </head>
26: <body>
27: <input type="button" value="确定" onclick="postValue();"/><br/>
28: 名字:<input type="text" name="name" id="name" /><br/>
29: 年龄:<input type="text" name="age" id="age" />
30: </body>
31: </html>
在该DEMO中遇到一个问题,那就是chrome中window.close()方法不起作用。最后通过,window.opener来解决chrome和IE的冲突。
具体参考:
http://www.cnblogs.com/chopper/archive/2012/06/25/2556266.html