<html>
<head><style>
*{margin:0; padding:0;}
ul{list-style:none;}
ul li{
float:left;
width:100px;
height:20px;
border:1px solid #000;
margin-right:2px;
display:inline;
text-align:center;
}
</style>
<script>
</script>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
方法一:
<script>
var listObj = document.getElementsByTagName("li");function bindEvent(nob){
this.clickFunc = function() {
var num = nob + 1;
alert("当前是第"+num+"个列表项");
}
}
for(var i=0;i<listObj.length;i++){
var col = new bindEvent(i);
listObj[i].onclick = col.clickFunc;
}
</script>
方法二:
<script type="text/javascript"> var listObj = document.getElementsByTagName("li");
var bindEvent = function(node){
var i;
for(i=0;i<node.length;i++){
node[i].onclick = function(i){
return function(){
var num = i + 1;
alert("当前是第"+num+"个列表项");
};
}(i);
}
}(listObj);
</script>
</html>