js循环给li绑定事件实现 点击li弹出其索引值 和内容
代码如下：
html代码
<ul>
<li>房产</li>
<li>家居</li>
<li>二手房</li>
</ul>
方法一:
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+"\n"+"文本内容是："+this.innerHTML); // \n换行 索引值从0开始
}
}
方法二：（常用）
var itemli = document.getElementsByTagName("li");
for(var i = 0; i<itemli.length; i++){
(function(n){
itemli[i].onclick = function(){
alert("下标索引值为："+n+"\n"+"文本内容是："+itemli[n].innerHTML); // \n换行 索引值从0开始
}
})(i)
}
或者or：
for(var i = 0; i<itemli.length; i++){
itemli[i].onclick = function(n){
return function(){
alert("下标索引值为："+n+"\n"+"文本内容是："+itemli[n].innerHTML); // \n换行 索引值从0开始
}
}(i)
}
方法三：jQuery（更简单）
$("ul li").click(function(){
var item = $(this).index(); //获取索引下标 也从0开始
var textword = $(this).text(); //文本内容
alert("下标索引值为：" + item +"\n"+ "文本内容是："+textword); // \n换行
})
希望对你有帮助， 整理一下。
最新文章
- SQLSERVER走起 APP隆重推出
- 【repost】JavaScript 事件模型 事件处理机制
- 为什么commonjs不适合于浏览器端
- JavaScript刷新页面n种方法
- node平台截取图片模块——jimp
- 最新Ubuntu10.10 更新源
- samba服务配置
- 用SQL语句断开某个数据库的所有活动连接
- PHP基本使用
- The constness of a method should makes sense from outside the object
- chrome调试学习
- Sqlserver 理解子查询
- 如何将你牛逼的iOS代码分享到CocoaPod（转）
- AXI总线简介
- gradle 编译war包出现乱码，设置为utf-8格式
- redis(1)--redis3.2.8安装
- blfs（systemd版本）学习笔记-编译安装gnome桌面组件及应用
- vue-CLI踩坑记
- 自己总结的C#编码规范--2.命名选择篇
- L1-056 猜数字