當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JS一个元素怎么绑定多个事件
生活随笔
收集整理的這篇文章主要介紹了
JS一个元素怎么绑定多个事件
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
有時候一個一個元素要綁定多個事件，其實是分開寫
先看這個例子，我們預期它先執行alert1，然后是alert2，但事實上是沒有alert1，因為覆蓋了
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>綁定多個事件</title><script>window.onload = function(){document.getElementById('btn').onclick = function () {alert(1);};document.getElementById('btn').onclick = function () {alert(2);};}</script> </head> <body><button id="btn">點我</button> </body> </html>只需要使用addEventListener方法即可解決這個問題：
<script>window.onload = function(){document.getElementById('btn').addEventListener('click', function(){alert(1);}, false);document.getElementById('btn').addEventListener('click', function(){alert(2);}, false);}</script>其中addEventListener的參數值得說一下，第一個參數是事件名稱，沒有on，第二個是回調函數，其實是瀏覽器調用的，第三個是 是否捕獲階段觸發，一般設置為false，還有就是這個方法是先綁定的先執行
另外，經過測試，發現這個addEventListener在IE8及一下版本不支持，可以使用attachEvent方法開替代，當然，是兼容處理
這個用法如下：
元素.attachEvent( 'onclick', function(){...} );這個方法是先綁定的后執行，當然，如果你這么介意順序，就沒必要分開綁定了
總結
以上是生活随笔為你收集整理的JS一个元素怎么绑定多个事件的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 【Python黑科技】tkinter库实
- 下一篇： JS中如何阻止事件的传播