首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js绑定事件代理的坑

js通过事件代理的方式绑定跳转事件,我这里的逻辑是把click事件绑定在最外层container上面,如果e.target包含我已经写好的class,则执行跳转逻辑。...但是这种方式好像只能是在点击的元素的上面,也就是最内层的元素上面有相应的class才能跳转,在外层加同样的class不生效,说明是我对于事件代理的理解不够深刻,其实事件代理的作用就是为了把目标元素的事件绑定在外层做代理...(e) { console.log(e.currentTarget) //获得当前绑定监听事件的元素, container console.log(e.target)/...) } },false) document.getElementById("container").classList.add('jumpUrl');//写在后面也可以绑定成功...注意:内层元素,即点击的目标元素必须是点击时真正的目标元素,而不是外面一层; currentTarget绑定相应想要点击的class的时候必须是做代理的即做事件监听的元素。

4.9K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JS动态加载数据绑定事件--delegate() 方法

    JS动态加载数据绑定事件-委托delegate() 方法 ---- W3C规范定义 定义和用法 delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数...---- JavaScript动态加载的数据,同时给他加载绑定事件,我选用Jquwey中的 delegate() 方法 我的理解,delegate()方法属于异步式加载绑定,dom元素加载未完成之前,可以委托给...delegate() 方法来实现的绑定操作。...").delegate(".top-nav-left","click",function() { window.history.back(); }); }); ---- 第一个参数为...要点击的标签属性 第二个参数为 要绑定事件 详情,请翻阅delegate() 方法 ---- 效果如图的返回按钮:

    7.9K30

    【小程序】数据和事件绑定和数据同步

    事件参 8. bindinput 的语法格式  9. 实现文本框和 data 之间的数据同步 数据绑定 1. 数据绑定的基本原则 在 data 中定义数据 在 WXML 中使用数据 2....通过 bindtap,可以为组件绑定 tap 触摸事件,语法如下: 在页面的 .js 文件中定义对应的事件处理函数,事件参数通过形参 event(一般简写成 e) 来接 收: 6....事件参 小程序中的事件参比较特殊,不能在绑定事件的同时为事件处理函数传递参数。...可以为组件提供 data-* 自定义属性参,其中 * 代表的是参数的名字,示例代码如下: 最终:  info 会被解析为参数的名字  数值 2 会被解析为参数的值 在事件处理函数中,通过 event.target.dataset...: 在页面的 .js 文件中定义事件处理函数: 9.

    95120

    【如果你要学JS 】——事件绑定及解除DOM事件

    绑定事件)注册事件有两种方式:传统方式和方法监听注册方式1.1传统方式1.利用on开头的事件onclick2....)方法将指定的监听器注册到eventTarget (目标对象)上,当该对象触发指定的事件时,就会执行事件处理函数.该方法接收三个参数:●type :事件类型字符串,比如click、mouseover ,...该方法接收两个参数:●eventNameWithOn :事件类型字符串,比如onclick、onmouseover ,这里要带on●callback :事件处理函数,当目标触发事件时回调函数被调用2.删除事件...father.addEventListener('click', function () { alert('father') }, false); 注意:JS...e 就是个事件对象写到我们侦听函数的小括号里面当形参来看事件对象只有有了事件才会存在,它是系统给我们自动创建的,不需要我们传递参数.事件对象是我们事件的一系列相关数据的集合跟事件相关的比信息

    19310

    js 动态生成 input 的绑定事件 blur 无效

    /article/details/89230040 ☯ 背景描述 今天在进行代码编写时,我需要根据ajax返回的数据动态生成一个表格,而针对于其中的input标签,要求设置失去焦点的blur事件...最开始编写的 js 代码如下: /** * 当sku库存量变化时,对应总库存进行更新 */ $(".input-sku-stock").blur(function ()...$(".input-goods_stock").val(input_goods_stock); }); 但是发现,静态的表格是可以正常实现的,而动态新生成的却无法触发blur事件...ி 附录 1.针对我的问题,求助度娘,发现了下面的一个帖子,可作参考 动态添加的blur事件失效 [问题点数:60分,结帖人lawrendc] 时间相当久远... 2.最接近解决需求的文章如下...,建议可自行测试 动态生成input绑定事件无效如:blur 意见:异步导致绑定事件失败,需使用全局绑定事件 3.w3school 文档 - onblur 事件 这就是官方文档

    8.9K00

    参数绑定

    bind作用和形式 bind用于将一个可调用对象绑定到新的可调用对象上,新对象的参数就是被绑定对象参数列表中的占位符所占据的位置的参数 其调用形式如下: auto newCallable=bind(callable...也可以包含被绑定对象的参数。arg_list应该和被绑定对象的参数一样多。...int b, int c) { if (a > b)return a + c; return b + c; } auto add = bind(sum, _1, _2, 10); 这样就将sum绑定由...,因为实际在调用新对象时,我们传递给新对象的参数实际就是那些占位符占据的位置的参数,所以上面调用情况如下: add(20,10) 时,参数20对应占位符1,参数10对应占位符2,故实际调用为sum(...20,10,10); add2(10,20)时,参数10对应占位符1,参数20对应占位符2,故实际调用为sum(20,10,10); 从而重排了参数顺序。

    90811

    参数绑定

    本文链接:https://blog.csdn.net/Enterprise_/article/details/102806998 bind作用和形式 bind用于将一个可调用对象绑定到新的可调用对象上...,新对象的参数就是被绑定对象参数列表中的占位符所占据的位置的参数 其调用形式如下: auto newCallable=bind(callable,arg_list); bind的第一个参数为一个可调用对象...也可以包含被绑定对象的参数。arg_list应该和被绑定对象的参数一样多。...int b, int c) { if (a > b)return a + c; return b + c; } auto add = bind(sum, _1, _2, 10); 这样就将sum绑定由...,因为实际在调用新对象时,我们传递给新对象的参数实际就是那些占位符占据的位置的参数,所以上面调用情况如下: add(20,10) 时,参数20对应占位符1,参数10对应占位符2,故实际调用为sum(

    1.7K50
    领券