jquery 将点击事件绑定到多个按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17715309/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery binding click event to multiple buttons
提问by user321963
I have 3 buttons b1, b2, b3. How to bind click on 3 buttons. Var b1 = $("#b1"); Var b2 = $("#b2");
我有 3 个按钮 b1、b2、b3。如何绑定点击 3 个按钮。var b1 = $("#b1"); var b2 = $("#b2");
$(b1,b2).bind("click", function(){});
jsfiddle.net/Xqpaq/
jsfiddle.net/Xqpaq/
回答by Arun P Johny
回答by Kevin Jantzer
I would highly suggest making the button click function a separate function and then bind each button to it
我强烈建议使按钮单击功能成为一个单独的功能，然后将每个按钮绑定到它
$(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);
});
The alternative is to use classesinstead of ids. Like so:
另一种方法是使用classes而不是ids. 像这样：
<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"/>
Then JS:
然后JS：
var btnClassClick = function(e){
alert("Button clicked from class: "+e.currentTarget.id);
}
$('.btn-click-action').on('click', btnClassClick);
回答by Simon Davies
wrap them in a div then target the div for all the button elements.
将它们包装在一个 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>
the js:
js：
$('#button-nav').on('click','button', function (evt) {
//-- do stuff
});
回答by Compulim
Giving jQuery an array will combine each item into a bigger jQuery object, thus you can bind your events in one shot.
给 jQuery 一个数组会将每个项目组合成一个更大的 jQuery 对象，因此您可以一次性绑定您的事件。
Assume b1 and b2 is DOM element, not jQuery object.
假设 b1 和 b2 是 DOM 元素，而不是 jQuery 对象。
$([b1, b2]).click(function (evt) {
// your code goes here
});
JSFiddler at http://jsfiddle.net/XF3Vv/1/.
JSFiddler 在http://jsfiddle.net/XF3Vv/1/。
回答by Developer
in your case:
在你的情况下：
just simply do like this below:
只需简单地在下面这样做：
cj('#b1, #b2').click(function(){
alert('you clicked either button 1 or button 2');
});
typical example: do some thing like this for different elements, if you click on any of these elements then this click event will be triggered
典型例子：对不同的元素做这样的事情，如果你点击这些元素中的任何一个，就会触发这个点击事件
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;
}
});
hope it helps some one :)
希望它可以帮助某人:)
