点击Delete后,删除员工信息
浏览器没报错,但是不实现对应的功能
<script type="text/javascript">
window.onland = function(){
//获取所有超链接
var allA = document.getElementsByTagName("a");
//为每一个超链接都绑定一个单击响应函数
for(var i=0;i<allA.length;i++){
allA[i].onclick = function(){
var tr = this.parentNode.parentNode;
//获取要删除的员工的名字
var name = tr.getElementByTagName("td")[0].innerHTML;
//删除之前弹出提示框
var flag = confirm("确认删除"+name+"吗?");
if(flag){
//删除tr
tr.parentNode.removeChild(tr);
}
return false;
};
}
};
</script>
<body>
<table id="employeeTable">
<tr>
<th>Name</th>
<th>Email</th>
<th>Salary</th>
<th> </th>
</tr>
<tr>
<td>Tom</td>
<td>tom@tom.com</td>
<td>5000</td>
<td><a href="javascript:;">Delete</a></td>
</tr>
<tr>
<td>Jerry</td>
<td>jerry@soho.com</td>
<td>8000</td>
<td><a href="deleteEmp?id=002">Delete</a></td>
</tr>
<tr>
<td>Bob</td>
<td>Bob@soho.com</td>
<td>6000</td>
<td><a href="deleteEmp?id=003">Delete</a></td>
</tr>
</table>
</body>
获取所有的a标签后,写了return false但是还是会跳转,
把第一个a标签修改成href="javascript:;"后不跳转了,但是点击后没有反应
点删除后,应该弹出 确认删除 的提示框,点击确认后再删除员工信息
问题1:
onload写错了, window.onland 改成 window.onload
问题2:
tr.getElementByTagName写错了,改成 tr.getElementsByTagName
最终代码(改了下格式):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table id="employeeTable">
<tr>
<th>Name</th>
<th>Email</th>
<th>Salary</th>
<th> </th>
</tr>
<tr>
<td>Tom</td>
<td>tom@tom.com</td>
<td>5000</td>
<td><a href="javascript:;">Delete</a></td>
</tr>
<tr>
<td>Jerry</td>
<td>jerry@soho.com</td>
<td>8000</td>
<td><a href="deleteEmp?id=002">Delete</a></td>
</tr>
<tr>
<td>Bob</td>
<td>Bob@soho.com</td>
<td>6000</td>
<td><a href="deleteEmp?id=003">Delete</a></td>
</tr>
</table>
</body>
<script type="text/javascript">
window.onload = function () {
//获取所有超链接
var allA = document.getElementsByTagName("a");
//为每一个超链接都绑定一个单击响应函数
for (var i = 0; i < allA.length; i++) {
console.log(allA[i])
allA[i].onclick = function () {
var tr = this.parentNode.parentNode;
//获取要删除的员工的名字
var name = tr.getElementsByTagName("td")[0].innerHTML;
//删除之前弹出提示框
var flag = confirm("确认删除" + name + "吗?");
if (flag) {
//删除tr
tr.parentNode.removeChild(tr);
}
return false;
};
}
};
</script>
</html>
不知道你这个问题是否已经解决, 如果还没有解决的话:请采纳,右侧采纳即可:
要更改函数名称,请将此行代码:
var name = tr.getElementByTagName("td")[0].innerHTML;
更改为:
var name = tr.getElementsByTagName("td")[0].innerHTML;
少个s,有用请采纳,打个赏。