jquery将click事件绑定到多个按钮

Question

我有3个按钮b1,b2,b3.如何绑定点击3个按钮.Var b1 = $("#b1"); Var b2 = $("#b2");

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

jsfiddle.net/Xqpaq/

Answer 1

你可以使用.add()

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

演示:小提琴

或使用多个选择器

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

演示:小提琴

Answer 2

我强烈建议将按钮单击功能作为一个单独的功能,然后将每个按钮绑定到它

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 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小提琴

Answer 4

为jQuery提供一个数组会将每个项目组合成一个更大的jQuery对象,因此您可以一次性绑定您的事件.

假设b1和b2是DOM元素,而不是jQuery对象.

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

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

Answer 5

在您的情况下：

只需在下面这样做即可：

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

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

});

典型示例：对不同的元素执行类似的操作，如果您单击这些元素中的任何一个，则将触发此click事件

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;
    }
});

希望对你有帮助:)