js循环给li绑定事件实现和弹出对应的索引

2024-09-27 23:20:23

原文：http://www.cnblogs.com/wuchuanlong/p/5945286.html

方法一，动态添加click事件，并添加属性

var itemli = document.getElementsByTagName("li");

    for (var i = 0; i < itemli.length; i++) {

　　　　itemli[i].index = i; //给每个li定义一个属性索引值

　　　　itemli[i].onclick = function () {

　　　　alert("索引为：" + this.index);

　　}

}

方法二，用闭包实现（常用）

var itemli = document.getElementsByTagName("li");

for (var i = 0; i < itemli.length; i++) {

　　(function (n) {

　　　　itemli[i].onclick = function () {

　　　　　　alert("索引为：" + n);

　　　　}

　　})(i)

}

或者

var itemli = document.getElementsByTagName("li");

for (var i = 0; i < itemli.length; i++) {

　　itemli[i].onclick = function (n) {

　　　　return function () {

　　　　　　alert("索引为：" + n);

　　　　}

　　}(i)

}

方法三，jquery实现（更简单）

$("ul li").click(function () {

　　var item = $(this).index();

　　alert("索引为：" + item);

})

最新文章

热门文章