JavaScript基础8——弹窗案例
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>弹窗案例</title> 6 </head> 7 <body> 8 编号：<input type="text" id="numid" /><br /> 9 姓名：<input type="text" id="nameid" /><br /> 10 <input type="button" value="选择" onclick="openUser()" /> 11 <script type="text/javascript"> 12 /* 13 14 */ 15 function openUser() { 16 window.open("user.html","","width=250,height=150"); 17 } 18 </script> 19 </body> 20 </html>
user.html
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>user</title> 6 </head> 7 <body> 8 <table border="1" width="200px"> 9 <tr> 10 <td>操作</td> 11 <td>编号</td> 12 <td>姓名</td> 13 </tr> 14 <tr> 15 <td><input type="button" value="选择" onclick="s1('100','张三')" /></td> 16 <td>100</td> 17 <td>张三</td> 18 </tr> 19 <tr> 20 <td><input type="button" value="选择" onclick="s1('101','李四')" /></td> 21 <td>101</td> 22 <td>李四</td> 23 </tr> 24 <tr> 25 <td><input type="button" value="选择"onclick="s1('102','王五')" /></td> 26 <td>102</td> 27 <td>王五</td> 28 </tr> 29 </table> 30 <script type="text/javascript"> 31 function s1(numid, nameid) { 32 // 把参数赋值到window页面 33 // 跨页面操作，opener得到创建这个窗口的窗口 34 var p = window.opener; 35 p.document.getElementById("numid").value = numid; 36 p.document.getElementById("nameid").value = nameid; 37 // 关闭当前窗口 38 window.close(); 39 } 40 </script> 41 </body> 42 </html>
