jquery綁定點擊事件到多個按鈕

Question

我有3個按鈕b1，b2，b3。如何綁定點擊3個按鈕。 Var b1 = $（「＃b1」）; Var b2 = $（「＃b2」）;

$(b1,b2).bind("click", function(){}); 

jsfiddle.net/Xqpaq/

Answer 1

給予jQuery的數組將每個項目合併成一個更大的jQuery對象，所以你可以綁定您的活動一個炮打響。

假設b1和b2是DOM元素，而不是jQuery對象。

$([b1, b2]).click(function (evt) { 
    // your code goes here 
}); 

在 http://jsfiddle.net/XF3Vv/1/

JSFiddler。

Answer 2

可以使用.add()

b1.add(b2).add(b3).click(function(){ 
}) 

演示：Fiddle

或使用multiple selector

$('#b1, #b2, #b3').click(function(){ 
}) 

演示：Fiddle

Answer 3

包起來一個div然後瞄準所有的DIV按鈕元素。

<div id="button-nav"> 
    <button class="button" type="button">button 1</button> 
    <button class="button" type="button">button 2</button> 
    <button class="button" type="button">button 3</button> 
</div> 

的JS：

$('#button-nav').on('click','button', function (evt) { 
    //-- do stuff 
}); 

JS Fiddle of the above

Answer 4

我會強烈建議把按鈕點擊功能一個單獨的函數，然後將每個按鈕綁定到它

http://jsfiddle.net/Xqpaq/1/

$(document).ready(function(){ 

    var b1 = $("#btn1"); 
    var b2 = $("#btn2"); 
    var b3 = $("#btn3"); 

    var btnClick = function(e){ 
     alert("Button: "+e.currentTarget.id); 
    } 

    b1.on('click', btnClick); 
    b2.on('click', btnClick); 
    b3.on('click', btnClick); 

}); 

替代方案是使用classes而不是ids。像這樣：

http://jsfiddle.net/Xqpaq/2/

<input type="button" id="btn1" class="btn-click-action" value="submit"/> 
<input type="button" id="btn2" class="btn-click-action" value="submit2"/> 
<input type="button" id="btn3" class="btn-click-action" value="submit3"/> 

然後JS：

var btnClassClick = function(e){ 
    alert("Button clicked from class: "+e.currentTarget.id); 
} 

$('.btn-click-action').on('click', btnClassClick); 

Answer 5

你的情況

：

只是簡單地做像下面這樣：

cj('#b1, #b2').click(function(){ 

     alert('you clicked either button 1 or button 2'); 

}); 

典型的例子： 做一些這樣的事對不同的元素，如果你點擊任何這些元素那麼這個單擊 將觸發事件

cj('#_qf_Contact_upload_view-top, #_qf_Contact_upload_new-top, ,#_qf_Contact_upload_view-bottom, #_qf_Contact_upload_new-bottom').click(function(){ 
    console.log(cj('#first_name').val()); 
    if(cj('#first_name').val() == '' || cj('#first_name').val().length == 0) 
    { 
     alert('First Name is a required field, cannot be empty'); 
     return false; 
    } 
}); 

希望這有助於有人:)