所有類型按鈕的事件處理程序

Question

我想提供一個能夠監聽所有按鈕點擊事件的功能。

Web開發人員可能會使用不同類型的按鈕。

<button></button>

要么

<input type="button"></input>

要么

<div class="button"></div>

等等

有沒有辦法為所有這些不同類型的按鈕添加公共事件處理程序？ 我想避免為每種創建按鈕的方法手動編寫事件處理程序。

編輯：你們中的許多人已經發布了一個很好的解決方案，創建一個公共類但不幸的是我不是創建按鈕我提供的功能，應用程序/網站開發人員將調用，我將收集所有類型的按鈕單擊事件和將它們發送到服務器。

Answer 1

一種可能的方法是為所有這些elements添加一個common class ：

 <buttonclass="btn"></button>
   <input type="button" class="btn"></input>
   <div class="button btn"></div>

然后在該類的幫助下聽取這些元素：

$('.btn').on('click', function(){
 //Your code
})

Answer 2

$(':button, .button').on('click', function() {
    // Event handler code
});

我建議您應該使用公共類來處理所有類型的按鈕並使用類添加事件：

<button class="myButton"></button>
<input type="button" class="myButton"></input>
<div class="button"></div>


$('.myButton').on('click', function() {
    // Event handler code
});

Answer 3

如果您創建了單擊事件處理程序，例如：

$('.btn-click').click(function() {
    alert('Hello World');
});

然后，您可以通過為其定義btn-click類，將此事件添加到多個不同的標記中。

<button class="btn-click"></button>

<input type="button" class="btn-click"></input>

<div class="button btn-click"></div>

工作JS小提琴： http ： //jsfiddle.net/VDesign/gvjLLf9L/