作者bibo9901 (function(){})()
看板Web_Design
标题Re: [问题] jquery 的 .on() 要如何用纯 js 实现?
时间Sat Aug 19 03:16:52 2017
※ 引述《tyf99 (呵呵)》之铭言:
: 如果想把某类元素(包含未来可能出现的同类元素)都加上 event handler
: 用纯 js 要如何实现?
: 例如放在购物车里面的商品,可以用按钮来修改数量.
: 现在是把 <button class="plus"> 绑上 goodsIncrease()
: 以後加入的新商品,也都会自动绑上 goodsIncrease()
: jquery 的写法是 $(document).on("click", "button.plus", goodsIncrease)
: 这要如何改写成不用 jquery 的版本?
这叫 event delegation, 也就是把 callback 绑定到 document 上,
再透过 event object 确定触发的element
document.addEventListener("click", function(event){
var target = event.target
if ( target.matches("button.plus") ){
goodsIncrease.call(target, event)
//假装是某个 button.plus 发出来的
}
})
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 101.8.48.101
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1503083814.A.47E.html
1F:→ tyf99: 感谢,这个就是我要的 08/19 16:28
2F:推 Kenqr: 推 08/19 18:37
3F:推 outofyou: 推 08/20 11:42
4F:推 jhnny97: 一直以为这样target会回传document,原来可以回传各个ele 08/20 13:33
5F:→ jhnny97: ment,受教了,推推 08/20 13:33