sự kiện nhấp vào liên kết jquery với nhiều nút

Question

Tôi có 3 nút b1, b2, b3. Cách liên kết nhấp vào 3 nút. Var b1 = $ ("# b1"); Var b2 = $ ("# b2");

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

jsfiddle.net/Xqpaq/

Answer 1

Giving jQuery một mảng sẽ kết hợp từng hạng mục vào một đối tượng jQuery lớn hơn, do đó bạn có thể liên kết các sự kiện của bạn trong một shot.

Giả sử b1 và b2 là phần tử DOM, không phải đối tượng jQuery.

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

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

Answer 2

bạn có thể sử dụng .add()

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

Demo: Fiddle

hoặc sử dụng multiple selector

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

Demo: Fiddle

Answer 3

bọc chúng trong một div sau đó nhắm vào div cho tất cả các yếu tố nút.

<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

tôi sẽ đánh giá cao đề nghị làm cho chức năng nút bấm một chức năng riêng biệt và sau đó ràng buộc mỗi nút để nó

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

}); 

Cách khác là sử dụng classes thay vì ids.Cũng giống như vậy:

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"/> 

Sau đó JS:

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

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

Answer 5

trong trường hợp của bạn:

chỉ đơn giản là làm như thế này dưới đây:

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

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

}); 

ví dụ điển hình: làm một số điều như thế này cho các yếu tố khác nhau, nếu bạn nhấp vào bất kỳ của các yếu tố sau đó nhấn này Sự kiện này sẽ được kích hoạt

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

hy vọng nó sẽ giúp một số một :)