jquery bind(click)传参让列表中每行绑定一个事件
点击列表中某行,弹出详情的需求比较常见。用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>
相关推荐
-
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
本文实例分析了jQuery中bind(),live(),delegate(),on()绑定事件方法.分享给大家供大家参考,具体如下: 前言 因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到各位朋友,文中如有不当之处,还望各位指正,话不多说,直接进入正题. 一.bind() 简要描述 bind()向匹配元素添加一个或多个事件处理器. 使用方式 复制
-
解析jQuery的三种bind/One/Live事件绑定使用方法
jQuery是 一款优秀的JavaScript框架,在旧版里主要用bind()方法,在新版里又多了两种One(),Live(),下面介绍这几种方法的使用: 1. bind/Unbind在jquery的事件模型中,有两个基本的事件绑 定函数,bind与unbind,这两个函数的含义就是匹配页面元素进行相关事件的处理.比如我们在JS中经常使用到的 onfocus,onblur,onmouseover,onmousedown等事件都可以作为bind的参数进行传递. $("#id").bind
-
jQuery中对未来的元素绑定事件用bind、live or on
对未来的元素绑定事件不能用bind, 1.可以用live代替,但是要注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了. 2.推荐用on代替(注:1.7及以上的版本才支持).用法:on(events,[selector],[data],fn) 复制代码 代码如下: //放在$(function(){})里才有效 $(document).on("click", "#testDiv", function(){
-
jQuery中绑定事件bind() on() live() one()的异同
jQuery中绑定事件的四种方法,他们可以同时绑定一个或多个事件 bind()-------------------------版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也移除) live()--------------------------版本号小于1.7(在Jquery1.7中已经移除,相应die()也移除) delegate()-------------------版本号小于1.7(在Jquery1.7中已经移除) on()------------------
-
JQuery入门——移除绑定事件unbind方法概述及应用
1.在DOM对象的实践操作中,既然存在用于绑定事件的bind方法,也相应存在用于移出绑定事件的方法,在JQuery中,可以通过unbind方法移除所有绑定的事件或某一个事件. 2.示例代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
一直没什么兴趣看jQuery,就用自己那点不咋样的javascript硬撑着,今天写一个功能时想尝试一下,用bind注册事件时发现怎么都不好使 复制代码 代码如下: $("#txtStation").bind("onpropertychange", GetStationLevel); 然后onclick之类的都试了,没一个能用的,无奈去翻jQuery的API,都是鸟语我也看不懂具体说了点了,但是发现bind注册事件都是没有on的. 发现有change事件,试了试 复
-
JQuery中绑定事件(bind())和移除事件(unbind())
有时候事件执行完了,想取消事件的效果可以通过一定的办法来处理.比如bind()(绑定事件)和unbind()(移除通过bind()方法添加的事件)方法来移除事件的效果. 比如下面的一个案例: 复制代码 代码如下: <script type="text/javascript"> $(function(){ $('#btn').bind("click", function(){ $('#test
-
jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
本文实例讲述了jQuery绑定事件监听bind和移除事件监听unbind用法.分享给大家供大家参考,具体如下: 这里分别采用后bind(eventType,[data],Listener)//data为可选参数,one()该方法绑定的事件触发一次后自动删除,unbind(eventType,Listener), 实例: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w
-
jQuery使用bind函数实现绑定多个事件的方法
本文实例讲述了jQuery使用bind函数实现绑定多个事件的方法.分享给大家供大家参考,具体如下: 在jQuery中绑定多个事件名称是,使用空格隔开,举例如下: $("#foo").bind("mouseenter mouseleave", function() { $(this).toggleClass("entered"); }); 在1.4版本以后,也可以如下绑定 $("#foo").bind({ click: func
-
jQuery中的on与bind绑定事件区别实例详解
on(events,[selector],[data],fn) events:一个或多个用空格分隔的事件类型和可选的命名空间,如"click"或"keydown.myPlugin" . selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代. data:当一个事件被触发时要传递event.data给事件处理函数. fn:该事件被触发时执行的函数. false 值也可以做一个函数的简写,返回false. bind(type,[data],fn) 为每
-
JQuery入门——用bind方法绑定事件处理函数应用介绍
1.bind()功能是为每个选择元素的事件绑定处理函数,其语法如下:bind(type, [data], fn) 其中type为一个或多个类型的字符串,如click或change,也可以自定义:可以被type调用的类型包括blur.focus.load.resize.scroll.unload.click.dbclick.mousedown等事件.参数data是作为event.data属性值传递对象的额外数据对象.参数fn是绑定到每个选择元素的事件中的处理函数. 2.示例代码: 复制代码 代码如
-
jQuery事件绑定on()、bind()与delegate() 方法详解
啃了一段日子的js相关了,学的过程中发现在jQuery中绑定事件时,有人用bind(),有人用on(),有人用delegate(),还有人用live(),看代码的时候觉得都实现功能了也就掀过去了,只是一直没完全弄懂之间的区别,于是今天查了下资料,自己做个总结. 之所以有这么多类型的绑定方法,是因为jQuery的版本更新的原因,如on()方法就是1.7以后出现的. jQuery的事件绑定api页面上,提到live()方法已经过时,不建议使用.所以这里我们主要就看下以下三个方法:bind().del
随机推荐
- EasyUI实现二级页面的内容勾选的方法
- 关于RequireJS的简单介绍即使用方法
- iOS UITableView展开缩放动画实例代码
- js或css文件后面跟参数的原因说明
- Windows2003下php5.4安装配置教程(IIS)
- SQL批量插入数据几种方案的性能详细对比
- js实现双击图片放大单击缩小的方法
- js实现动态添加、删除行、onkeyup表格求和示例
- 奇特的js写法,或许可以用来加密躲杀毒软件什么的
- Spring+SpringMVC+MyBatis深入学习及搭建(三)之MyBatis全局配置文件解析
- MySQL重置root密码提示"Unknown column ‘password"的解决方法
- 页面元素绑定jquery toggle后元素隐藏的解决方法
- js+html5绘制图片到canvas的方法
- 关于Promise 异步编程的实例讲解
- C#装饰器模式(Decorator Pattern)实例教程
- Asp.net图片上传实现预览效果的简单代码
- 给文字加上着重号的JS代码
- 什么是PEAR?什么是PECL?PHP中两个容易混淆的概念解释
- ios电子书翻页效果代码详解
- Android实现标题上显示隐藏进度条效果