javascript学习笔记—简单的动态选择收件人/联系人

来源：互联网发布：学生网络兼职打字员编辑：程序博客网时间：2024/06/08 23:10

收件人.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head>  <title>收件人</title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <script type="text/javascript">function showContact(){//用变量接收返回的联系人列表。注意只有模式窗口才能有返回值！var returnValue = window.showModalDialog("联系人列表.html","联系人列表","dialogWidth:500px;dialogHeight:400px");var txt = document.getElementById("name");txt.value = returnValue; //给收件人文本框赋值}  </script> </head> <body><h1>发送消息/邮件</h1>收件人：<input type="text" id="name" /><input type="button" value="选择联系人" onclick="showContact()" /> </body></html>

联系人列表.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head>  <title>联系人列表</title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <style type="text/css">table{border:1px solid green;border-collapse:collapse;width:400px;text-align:center;}table th,td{border:1px solid green;}</style>  <script type="text/javascript">function confirmContact(){var ck = document.getElementsByName("contact");var contactArr = check();if(ck.length){window.returnValue = contactArr.join(); //如果选中联系人，就将联系人返回window.close(); //关闭窗体}else{alert("请选择一个联系人"); //如果没有选中，就提示选择}}//将选择的联系人放到集合里function check(){var ck = document.getElementsByName("contact");var arr = [];for(var i=0;i<ck.length;i++){if(ck[i].checked){arr.push(ck[i].value);}}return arr;}  </script> </head> <body>  <h3>选择联系人</h3><table><tr><th>选择</th><th>编号</th><th>姓名</th></tr><tr><td><input type="checkbox" name="contact" value="张龙" /></td><td>1</td><td>张龙</td></tr><tr><td><input type="checkbox" name="contact" value="赵虎" /></td><td>2</td><td>赵虎</td></tr><tr><td><input type="checkbox" name="contact" value="王朝" /></td><td>3</td><td>王朝</td></tr><tr><td><input type="checkbox" name="contact" value="马汉" /></td><td>4</td><td>马汉</td></tr><tr><td colspan="3"><input type="button" value="确定" onclick="confirmContact();" /></td></tr></table> </body></html>