您的位置：首页 > 其它

为所有a标签绑定同一个事件（闭包）

2017-09-09 22:39 232 查看

css代码：

body{text-align:center;}
body table{margin:0 auto;}
table{border-collapse:collapse; border:solid 1px Black; }
table td,th{border:solid 1px; padding:5px;}

html代码：

<html>
<head>
<title>user.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=GBK">

<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>

<table id="usertable">
<tr>
<th>姓名</th>
<th>email</th>
<th>电话</th>
<th> </th>
</tr>

<tr>
<td>Tom</td>
<td>tom@tom.com</td>
<td>5000</td>
<td><a href="deleteEmp?id=Tom">Delete</a></td>
</tr>

<tr>
<td>Jerry</td>
<td>jerry@sofu.com</td>
<td>8000</td>
<td><a href="deleteEmp?id=Jerry">Delete</a></td>
</tr>
</table>

</body>

<script type="text/javascript">

//为a标签绑定事件
//错误示例：
/* a.onclick = function(){
var res = confirm("你确认要删除【"+name+"】吗？");
if(res){            a.parentNode.parentNode.parentNode.removeChild(a.parentNode.parentNode);
}
return false;       //阻止a标签的默认行为：跳转新标签
}; */
//正确方法
var aNodes = document.getElementsByTagName("a");
for(var i=0;i<aNodes.length;i++){
(function(j){
aNodes[j].onclick=function(){
var res = confirm("你确认要删除【"+aNodes[j].id+"】吗？");
if(res){
aNodes[j].parentNode.parentNode.parentNode.removeChild(aNodes[j].parentNode.parentNode);
}
return false;       //阻止a标签的默认行为：跳转新标签
}
})(i)
}

</script>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 闭包事件绑定标签

相关文章推荐

新的分享

章节导航