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>

转载于:https://www.cnblogs.com/linyisme/p/5865033.html

JavaScript基础8——弹窗案例相关推荐

JavaScript 基础语法循环案例练习
JavaScript 基础语法循环案例练习文章目录 JavaScript 基础语法循环案例练习前言一.早午晚安喵喵喵二.判断奇偶数三.班长请客四.1-100跳过个位为3的数求和五.第几个 ...
JavaScript基础部分经典案例
再复杂的程序都是由一个个简单的部分组成. 001案例 - 交换两个变量的值方法01 - 使用临时变量 var n1 = 5;var n2 = 6;// 创建一个临时中介变量 tmpvar tmp;/ ...
javaScript基础学习 - 14 - JavaScript内置对象 -案例代码
javaScript基础学习 - 14 - JavaScript内置对象 -案例代码 1. Math对象最大值 2. 封装自己的数学对象 3. Math绝对值和三个取整方法 4. Math对象随机数方 ...
JavaScript基础语法及小案例
目录 JavaScript基础语法 1. 变量声明和赋值 2. 数据类型 1) 基本数据类型 2) 复合数据类型(引用类型) 3) 特殊数据类型 3. 运算符 1) 算术运算符 2) 赋值运算符 3) ...
JavaScript基础语法笔记，ECMAScript基础，每部分都有经典案例以及解析。会持续更新（2022.0310）
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一.JavaScript导读 1.1 什么是JavaScript(这里借鉴Js红宝书的内容,看一看就可以了) 1.2 ...
Javaweb学习笔记——（三）——————JavaScript基础DOM基础
day03 1.js的String对象 **创建String对象 ***var str = "abc"; **方法和属性(文档) ***属性 lenth:字符串的长度 ***方法 ...
第五模块·WEB开发基础-第2章JavaScript基础
第1章 JavaScript基础 01-JavaScript历史介绍 02-JavaScript的组成 03-JavaScript的引入方式 04-变量的使用 05-基本数据类型(一) 06-基本数据 ...
JavaScript 基础知识 - BOM篇
前言本篇文章是JavaScript基础知识的BOM篇,如果前面的<JavaScript基础知识-DOM篇>看完了,现在就可以学习BOM了. 注意: 所有的案例都在这里链接: 提取密码密码 ...
JavaScript 基础知识
JavaScript 基础知识文章目录 JavaScript 基础知识 @[toc] 一.JS的基本语法与结构 1.1 JavaScript 用法 1.2 JavaScript 输出 1.3 Jav ...

JavaScript基础8——弹窗案例

JavaScript基础8——弹窗案例相关推荐

最新文章

热门文章