Re: [問題] jquery 的 .on() 要如何用純 js 實現?

作者: bibo9901 (function(){})()   2017-08-19 03:16:52
※ 引述《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 發出來的
}
})
作者: tyf99 (呵呵)   2017-08-19 16:28:00
感謝,這個就是我要的
作者: Kenqr (function(){})()   2017-08-19 18:37:00
作者: outofyou   2017-08-20 11:42:00
作者: jhnny97 (≡(  ゚Д゚))   2017-08-20 13:33:00
一直以為這樣target會回傳document,原來可以回傳各個element,受教了,推推

Links booklink

Contact Us: admin [ a t ] ucptt.com