javascript 之父子窗口交互动态增加option

来源：互联网发布：紫砂壶淘宝店推荐编辑：程序博客网时间：2024/06/15 23:18

子窗口：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><script type="text/javascript">function add() {var diploma = document.getElementById("name").value;window.opener.setValues(diploma);window.opener = null;window.close();}</script></head><body><input name="name" id="name"><input type="button" value="确定" onclick="add();"></body></html>

父窗口：

<!DOCTYPE html><html>  <head>    <title>open_select.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">--><script type="text/javascript">function openWin() {window.open("add.html",'_blank','height=200,width=400,status=yes,toolbar=no,menubar=no,location=no');}function setValues(diploma) {var option = document.createElement("option");var textNode = document.createTextNode(diploma);option.appendChild(textNode);var select = document.getElementById("diploma");select.appendChild(option);}</script>  </head>    <body><select id="diploma" style="margin-right:8px"><option name="benke">本科</option></select><input type=button id="add" name="add" style="margin-left:10px" value="增加" onclick="openWin();"/>  </body></html>

在子窗口中调用父类窗口中的js 方法：

function add() {var diploma = document.getElementById("name").value;window.opener.setValues(diploma);window.opener = null;window.close();}

javascript 之 父子窗口 交互 动态增加option

javascript 之父子窗口交互动态增加option