最近在进行页面开发，在做页面特效的时候，需要给一个动态加载的按钮赋予一个事件 于是不假思索的 用$(obj).bind(); 来绑定事件 。 但是这样存在一个问题： bind确实能绑定事件，但是那是相对于固定的html标签来说 当页面内容属于动态加载的时候，bind事件就存在一个bug, 只能bind一次，当你第二次触发事件的时候就没用了 当我使用bind来绑定click事件，这时， 第一次点击click能成功触发 但是第二次点击，click事件无效了... 后面研究发现，jQuery还有个绑定事件的方法：delegate(); 用法如下： $(".sentnum-box").delegate(".a-add-ordergoods","click",function (){ //js数据代码 }); 这样就能实现对动态数据绑定事件，并永不失效
mouseenter() 鼠标进入（进入子元素不触发） mouseleave() 鼠标离开（离开子元素不触发） hover() 同时为mouseenter和mouseleave事件指定处理函数 ready () DOM加载完成 resize() 浏览器窗口的大小发生改变 scroll() 滚动条的位置发生变化 submit() 用户递交表单 绑定事件的其他方式 $(function(){ $('# div1').bind('mouseover click', function(event) { alert($(this).html()); }); }); 取消绑定事件 $( 可以看到，使用这种方式绑定click事件也是可以的。 那么，如果希望点击一次就不能点击，就可以设置一下解绑事件，如下： ? 从这里可以看出，只能触发一次click事件。因为已经解除绑定了。 同时绑定两个事件 click mouseover ? 两个事件都可以触发打印日志。那么解绑是不是也一样可以写多个的呢？ ? 解除绑定的确可以写多个事件同时解除。
提供包括云服务器，云数据库在内的90+款云计算产品。打造一站式的云产品试用服务，助力开发者和企业零门槛上云。
总结一下：jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式，分别是 bind、live、delegate、on live、delegate 不多用，在Jquery1.7中已经移除，这里不多说 重点介绍 bind、on bind(event,[data],function) bind 是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数 3.绑定事件监听函数：绑定事件的另一种方法是用 addEventListener() 或 attachEvent() 来绑定事件监听函数。 一. 在DOM元素中直接绑定 1. jQuery 中的事件绑定具有叠加性，JavaScript 的事件绑定则是可覆盖的。 原生的事件绑定，可以发现只执行了最后一个相同的绑定事件，后面绑定的事件处理函数覆盖了前面的事件处理函数。
事件绑定分为两种：一种是传统事件绑定(内联模型，脚本模型)，一种是现代事件绑定(DOM2级模型)。现代事件绑定在传统绑定上提供了更强大更方便的功能。 一．传统事件绑定的问题 传统事件绑定有内联模型和脚本模型，内联模型我们不做讨论，基本很少去用。先来看一下脚本模型，脚本模型将一个函数赋值给一个事件处理函数。 那么W3C现代事件绑定可以设置冒泡和捕获。 PS：IE中的事件绑定函数attachEvent()和detachEvent()可能在实践中不去使用，有几个原因：1.IE9就将全面支持W3C中的事件绑定函数；2.IE的事件绑定函数无法传递this；3 .IE的事件绑定函数不支持捕获；4.同一个函数注册绑定后，没有屏蔽掉；5.有内存泄漏的问题。
.bind() 为一个元素绑定一个元素处理程序。 }); // 一次可以绑定多个 事件，用逗号隔开， .delegate() 为所有匹配选择器的元素绑定一个或者多个事件处理函数，基于一个指定的根元素的子集，匹配的元素包括那些匹配到的元素，也包括那些今后可匹配的元素 ： .on() 在选定的元素上绑定一个或多个事件处理函数。 .trigger() 根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为。 false 解除绑定相应的'return false'函数，这个函数使用.bind( eventType,false )绑定。
Angular6+ 事件绑定 临近毕业开始了第二段实习，因为项目需求，技术栈从Vue转到Angular，才发现Angular已经到7了？？？？？ 事件绑定的基础语法 或者可以使用带 on-前缀的形式 <button on-click 是的，这就是 Angular 中的双向绑定。 通过@HostListenr 把事件绑定在宿主监听器上 把一个事件绑定到一个宿主监听器，并提供配置元数据。 当宿主元素发出特定的事件时，Angular 就会执行所提供的处理器方法，并使用其结果更新所绑定到的元素。 如果该事件处理器返回 false，则在所绑定的元素上执行 preventDefault。
简介 在原生 html + js 的项目中，如果需要给一个元素添加一个鼠标点击事件，可以在 DOM 上使用 onclick 来绑定一个事件。 <button @[event]="handleClick">态参数的缩写 (2.6.0+)</button> ` }).mount('#root') // 使用 mount 绑定要监听的元素 </script> 在 Vue 中事件绑定方式一共有3中，分别是： 完整语法：v-on 简写：@ 动态参数：@[event] 其中动态参数中的 event 可以对应 data 里对应的数据。 "one($event), two($event)"> Submit </button> ` }).mount('#root') // 使用 mount 绑定要监听的元素 官方提供的事件修饰符 .stop -- 阻止事件冒泡 .prevent -- 拦截默认事件 .capture -- 阻止事件捕捉 .self -- 忽略了事件冒泡和事件捕获的影响，只有直接作用在该元素上的事件才会被调用
标准库bind函数 我们可以解决向check_size传递一个长度参数的问题。 方法是使用一个新的名为bind的标准库函数，它定义在头文件functional中。 与bind函数一样，placeholders命名空间也定义在functional头文件中 bind的参数 我们可以用bind绑定给定可调用对象中的参数或重新安排其顺序。 因此，当sort比较两个元素时，就好像调用isShorter(B,A); 绑定引用参数 默认情况下，bind的那些不是占位符的参数被拷贝到bind的返回的可调用对象中。 标准库中还有一个cref 函数，生成一个保存const引用的类 与bind一样，函数ref和cref定义在头文件functional中 注意： 标准库中定义了两个分别为bindlst和bind2nd的函数 与bind类似，这两个函数接收一个函数做参数，生成一个可调用对象，该对象调用给定函数，并将绑定参数传递给它。 但是，这些函数分别只能绑定第一个或者第二个参数。
绑定click事件 给元素绑定click事件，可以用如下方法： $('#btn1').click(function(){ // 内部的this指的是原生对象 // 使用jquery 1 2 4 5 6 选项卡示例 通过index()方法可以得到点击事件的元素序号
大家都知道解绑事件的jquery写法，很简单： $("xxx").unbind("click"); 然后对于事件委托式的事件绑定，亲测，这种解绑方法是无效的， $(".sideNav>ul").on(" click", function (e) { alert("aaa"+$(e.tagert).index()); ｝ 即使做判断让一部分带有某个class的li标签的ul解绑click， 依然无效，事件委托会直接跳过判断，执行冒泡 解决办法： 给不想绑定点击事件的li元素阻止冒泡： $(".sideNav>ul>li.c-808").click(function(e){
事件修饰符 stop的使用会阻止冒泡，但是同时绑定了一个非冒泡的事件，会导致该元素上的catchEventName失效！ prevent可以直接干掉，因为uni-app里没有什么默认事件，比如submit并不会跳转页面。 也不能做，因为uni-app没有removeEventListener,虽然可以直接在handleProxy中处理，但非常的不优雅，违背了愿意，暂不考虑按键修饰符：uni-app运行在手机端，没有键盘事件 view 视图容器 hover-class 类型为string，默认值none 指定按下去的样式类，类hover-class="none"时，没有点击态效果 hover-stop-propagation 类型boolean，默认值false 指定是否阻止本节点的祖先节点出现点击态 hover-start-time 类型number，默认值50 按住后多久出现点击态 hover-stay-time
}) return { clientOne, clientTwo } } } </script> 实现 /** * dom 事件绑定 * @param { String } name 事件名称 * @param { Function } handler 回调函数 * @param { Element } target 绑定对象 , handler, option) addEvent.call(target, name, handler, Option) return remove } /** * vm 事件绑定 * @param { String } name 事件名称 * @param { Function } handler 回调函数 * @param { vm } vm 绑定vue实例 * @ }) * // 绑定事件，并返回移除函数 * const removeTime = vmEventHook('time', () => console.log(new Date()), vm) *
Vue事件绑定原理 Vue中通过v-on或其语法糖@指令来给元素绑定事件并且提供了事件修饰符，基本流程是进行模板编译生成AST，生成render函数后并执行得到VNode，VNode生成真实DOM节点或者组件时候使用 addEventListener方法进行事件绑定。 描述 v-on与@用于绑定事件监听器，事件类型由参数指定，表达式可以是一个方法的名字或一个内联语句，如果没有修饰符也可以省略，用在普通元素上时，只能监听原生DOM事件，用在自定义元素组件上时，也可以监听子组件触发的自定义事件 .self: 只当事件是从侦听器绑定的元素本身触发时才触发回调。 .{keyCode | keyAlias}: 只当事件是从特定键触发时才触发回调。 // 处理v-bind的情况 // ... } else if (onRE.test(name)) { // v-on // 处理事件绑定 name = name.replace
我实现点击table表格中的删除按钮，找到当前按钮的祖先元素tr 然后删除该行，但是我首先点击删除的时候要先弹出提示框，是否要下载，这时在点击删除按钮删除，之前没有考虑到事件重复绑定问题，所以每次点击删除的时候就会多选择几行 ，之后选择的越来越多，经过网友解答，成功解决，先把重复绑定的删除的click事件解绑再继续绑定，就没问题。
绑定事件：bind()、on()、live()、delegate()、keyup()； 触发事件：trigger(‘keyup’)、keyup()； 解绑事件：unbind()、off()、die ()、undelegate()； 符合事件：hover() 、toggle()； 事件绑定：bind()； ---- 一、绑定事件 JQuery绑定事件，除 bing() 方法之外 ，还有 on()、live()、one() 等 事件的绑定方法。 绑定事件分类： （a） 绑定单个事件 $("#btn").bind("click",function(){ //代码块 console.log(123); }); （b） 同时绑定多个事件 "); } }); JQuery中的 bind()、live()、delegate()事件方法的区别，请查阅： http://www.php100.com/html/program/jquery
一个同时问我，JQuery事件绑定为什么不生效，最好通过查找，发现了问题。 一般而言，JQuery事件绑定不生效，是一些新手经常遇到的问题，其实都是简单的问题，大概分两种情况。 先上代码,以下两个button的事件绑定都不生效。 <html> <head> <script src=".. 在未加载完成之前，通过$("#button1").click方法来进行事件绑定，由于此时未加载完成，实际上$("#button1")是一个空数组，所以最终的结果是未对任何元素进行事件绑定。 的方法被创建出来，然后被加入到body中，然后绑定事件，之后从body中移除，然后在加入body中： var div = $("<button id = 'button2'>button2< ，然后在加入的时候，事件绑定已经不存在了；这种情况应该如何解决呢？59130ListView绑定点击事件 原14430jQuery on绑定事件问题 </body> </html> 以前没注意，最近在使用on绑定事件时发现，通过for循环绑定动态绑定时，多个元素最终绑定的都是最后一次事件，不知道用while是不是也是一样，谁有清楚这种现象也可以说一下原因 解决方案：将for里面的绑定逻辑单独写一个函数即可。
腾讯云事件总线(EB)是一款安全，稳定，高效的无服务器事件管理平台，支持腾讯云服务、自定义应用、SaaS应用以标准化、中心化的方式接入，帮助您轻松实现无服务器事件驱动架构。
扫码关注云+社区
领取腾讯云代金券
云服务器
测试服务 WeTest
云数据库 PostgreSQL
文件存储
SSL 证书