jquery bind(click)传参让列表中每行绑定一个事件


Posted in Javascript onAugust 06, 2014

点击列表中某行,弹出详情的需求比较常见。用jquey bind 点击事件时,传参不注意可能会导致点击每一行都是显示相同内容的情况,这大多数是因为传参没注意引起的问题。简易代码如下:

for(var i=0;i<2;i++) { 
$("#b" + i).bind("click", {'bindText':bindText + i}, function(e){ 
butClick(e); 
}); 
}

测试代码:

<html> 
<head> 
<script type="text/javascript" src="/jquery/jquery.js"></script> 

<script type="text/javascript"> 
$(document).ready(function(){ 
var bindText = 'AAA'; 
for(var i=0;i<2;i++) { 
$("#b" + i).bind("click", {'bindText':bindText + i}, function(e){ 
butClick(e); 
}); 
} 
}); 

function butClick(e) { 
alert(e.data.bindText); 
} 
</script> 
</head> 
<body> 
<button id="b0">请点击这里0</button> 
<button id="b1">请点击这里1</button> 
</body> 
</html>
Javascript 相关文章推荐
Jquery+JSon 无刷新分页实现代码
Apr 01 Javascript
jQuery选择器中含有空格的使用示例及注意事项
Aug 25 Javascript
JS实现两个大数(整数)相乘
Apr 28 Javascript
JavaScript 作用域链解析
Nov 13 Javascript
node.js操作mysql(增删改查)
Jul 24 Javascript
jquery实现的动态回到顶部特效代码
Oct 28 Javascript
详解Angular的8个主要构造块
Jun 20 Javascript
初探JavaScript 面向对象(推荐)
Sep 03 Javascript
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
JavaScript实现数字前补“0”的五种方法示例
Jan 03 Javascript
原生js实现点击轮播切换图片
Feb 11 Javascript
Openlayers实现距离面积测量
Sep 28 Javascript
jQuery html()方法使用不了无法显示内容的问题
Aug 06 #Javascript
JQuery设置获取下拉菜单某个选项的值(比较全)
Aug 05 #Javascript
js触发select onchange事件的小技巧
Aug 05 #Javascript
jquery中each遍历对象和数组示例
Aug 05 #Javascript
js 动态修改css文件的方法
Aug 05 #Javascript
JS实现关键字搜索时的相关下拉字段效果
Aug 05 #Javascript
js实现点击后将文字或图片复制到剪贴板的方法
Aug 04 #Javascript
You might like
重置版宣传动画
2020/04/09 魔兽争霸
php+mysql 实现身份验证代码
2010/03/24 PHP
PHP 多维数组的排序问题 根据二维数组中某个项排序
2011/11/09 PHP
解析PHP中的内存管理,PHP动态分配和释放内存
2013/06/28 PHP
zend optimizer在wamp的基础上安装图文教程
2013/10/26 PHP
jquery 弹出层实现代码
2009/10/30 Javascript
javascript基础第一章 JavaScript与用户端
2010/07/22 Javascript
用JS实现一个TreeMenu效果分享
2011/08/28 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
2013/04/09 Javascript
jquery中通过父级查找进行定位示例
2013/06/28 Javascript
js jquery获取随机生成id的服务器控件的三种方法
2013/07/11 Javascript
多种方法实现load加载完成后把图片一次性显示出来
2014/02/19 Javascript
实例解析angularjs的filter过滤器
2016/12/14 Javascript
深入理解node.js之path模块
2017/05/03 Javascript
基于ES6 Array.of的用法(实例讲解)
2017/09/05 Javascript
VUE安装使用教程详解
2019/06/03 Javascript
微信小程序实现类似微信点击语音播放效果
2020/03/30 Javascript
Vue 自定义标签的src属性不能使用相对路径的解决
2019/09/17 Javascript
vue-cli4使用全局less文件中的变量配置操作
2020/10/21 Javascript
Python学生信息管理系统修改版
2018/03/13 Python
python实现简单遗传算法
2018/03/19 Python
python dataframe常见操作方法:实现取行、列、切片、统计特征值
2018/06/09 Python
Python 2/3下处理cjk编码的zip文件的方法
2019/04/26 Python
详解python 利用echarts画地图(热力图)(世界地图,省市地图,区县地图)
2019/08/06 Python
python实现修改固定模式的字符串内容操作示例
2019/12/30 Python
python基于Kivy写一个图形桌面时钟程序
2021/01/28 Python
CSS3弹性盒模型开发笔记(二)
2016/04/26 HTML / CSS
canvas绘制文本内容自动换行的实现代码
2019/01/14 HTML / CSS
美国家喻户晓的保健品品牌:Vitamin World(维他命世界)
2016/08/19 全球购物
马歇尔耳机官网:Marshall Headphones
2020/02/04 全球购物
sort命令的作用和用法
2012/11/04 面试题
优秀教研组申报材料
2014/12/26 职场文书
入党申请书格式
2019/06/20 职场文书
公司财务制度:成本管理控制制度模板
2019/11/19 职场文书
python神经网络编程之手写数字识别
2021/05/08 Python
Java服务调用RestTemplate与HttpClient的使用详解
2022/06/21 Java/Android