目的：将通过鼠标单击事件将子窗口中的表格信息添加到父窗口中
准备父窗口（父窗口是一个学生信息窗口，每一个学生可以对象多个老师）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>父窗口</title>
</head>
<script type="text/javascript">
function doSearch(){
window.open('/review/子窗口.html', '选择组织机构代码', 'width=720, height=400, scrollbars=no');
}
function addNewRow(teano,teaname,classno){
//获取表格
var superTable = document.getElementById("super");
//获取表格现有的总行数
var index =superTable.length;
//在表格末尾添加一行
var tableRow =superTable.insertRow(index);
//设置tableRow的id
tableRow.id=teano;
//设置tableRow的背景色
tableRow.style.background="white";
//给新添加的5个单元格
var tableCell0=tableRow.insertCell(0);
var tableCell1=tableRow.insertCell(1);
var tableCell2=tableRow.insertCell(2);
var tableCell3=tableRow.insertCell(3);
//给每一个单元格设置HTML
tableCell0.innerHTML=teano;
tableCell1.innerHTML=teaname;
tableCell2.innerHTML=classno;
tableCell3.innerHTML="<button onclick='delRow("+teano+")' style='cursor:pointer'>删除</button>";
}
function delRow(tableRowId){
var superTable =document.getElementById("super");
var tableRow=document.getElementById(tableRowId);
superTable.deleteRow(tableRow.rowIndex);
}
</script>
<body>
<table id="super" border="2px" align="center">
<tr align="center">
<td colspan="4">
学生基本信息
</td>
</tr>
<tr>
<td>
学生姓名：
</td>
<td>
<input type="text">
</td>
<td>
性别：
</td>
<td>
<input type="radio">男
<input type="radio">女
</td>
</tr>
<tr>
<td>
籍贯：
</td>
<td>
<input type="text">
</td>
<td>
政治面貌：
</td>
<td>
<input type="text">
</td>
</tr><tr>
<td>
爱好：
</td>
<td>
<input type="text">
</td>
<td>
身份证：
</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td colspan="4" align="center">
学生代课老师信息
<button onclick="doSearch()">查询</button>
</td>
</tr>
</table>
</body>
</html>
为查询按钮注册事件doSearch();
function doSearch(){
window.open('/review/子窗口.html', '选择代课老师', 'width=720, height=400, scrollbars=no');
}准备子窗口
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="2px" align="center">
<tr align="center">
<td colspan="4">
教师基本信息
</td>
</tr>
<tr>
<td>
教师编号
</td>
<td>
教师姓名
</td>
<td>
教师性别
</td>
<td>
所带班级
</td>
</tr>
<tr>
<td>
1
</td>
<td style="cursor: pointer;" onclick="window.opener.addNewRow(1,'张三','1')">
张三
</td>
<td>
男
</td>
<td>
1
</td>
</tr>
<tr>
<td>
2
</td>
<td style="cursor: pointer;" onclick="window.opener.addNewRow(2,'李四','2')">
李四
</td>
<td>
女
</td>
<td>
2
</td>
</tr>
<tr>
<td>
3
</td>
<td style="cursor: pointer;" onclick="window.opener.addNewRow(3,'王五','6')">
王五
</td>
<td>
女
</td>
<td>
6
</td>
</tr>
</table>
</body>
</html>
为教师姓名注册鼠标单击事件
<td style="cursor: pointer;" onclick="window.opener.addNewRow(1,'张三','1')">
张三
</td>window.opener表示调用父窗口中的函数
在父窗口中创建addNewRow()函数
function addNewRow(teano,teaname,classno){
//获取表格
var superTable = document.getElementById("super");
//获取表格现有的总行数
var index =superTable.length;
//在表格末尾添加一行
var tableRow =superTable.insertRow(index);
//设置tableRow的id
tableRow.id=teano;
//设置tableRow的背景色
tableRow.style.background="white";
//给新添加的5个单元格
var tableCell0=tableRow.insertCell(0);
var tableCell1=tableRow.insertCell(1);
var tableCell2=tableRow.insertCell(2);
var tableCell3=tableRow.insertCell(3);
//给每一个单元格设置HTML
tableCell0.innerHTML=teano;
tableCell1.innerHTML=teaname;
tableCell2.innerHTML=classno;
tableCell3.innerHTML="<button onclick='delRow("+teano+")' style='cursor:pointer'>删除</button>";
}在父窗口创建delRow()函数
function delRow(tableRowId){
var superTable =document.getElementById("super");
var tableRow=document.getElementById(tableRowId);
superTable.deleteRow(tableRow.rowIndex);
}最终实现
