jQuery 如何遍历所有选中的复选框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6451230/
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
How can I iterate through all my checked checkboxes?
提问by JonAndMarie
My site has the following:
我的网站有以下内容：
<td><input id="inp_0001010030" type="checkbox"></td>
<td><input id="inp_0001010031" type="checkbox"></td>
<td><input id="inp_0001010032" type="checkbox"></td>
<td><input id="inp_0001010033" type="checkbox"></td>
<td><input id="inp_0001010034" type="checkbox"></td>
These are created dynamically.
这些是动态创建的。
And a form that's at the bottom of the page outside of the area with the above rows:
以及位于具有上述行区域之外的页面底部的表单：
<form action="??" method="??" >
<input value="Action" type="submit">
<select id="SelectedAction" >
<option value="1">Delete</option>
<option value="2">Move</option>
</select>
</form>
After the rows have been created I need to have the clicked event the form button go look at each checkbox and then call a javascript function with the id and the value of SelectedAnswer for each checkbox that it finds checked.
创建行后，我需要点击事件，表单按钮查看每个复选框，然后调用一个带有 id 和 SelectedAnswer 值的 javascript 函数，为它找到的每个复选框都选中。
Note that if there is a way to do this without the form then it's even better. I just don't know enough about jQuery.
请注意，如果有一种方法可以在没有表单的情况下做到这一点，那么它会更好。我只是不太了解 jQuery。
Is this the kind of thing I can do easily with jQuery?
这是我可以用 jQuery 轻松完成的事情吗？
回答by M?rten Wikstr?m
$("input[type=submit]").click(function () {
var answer = $("#SelectedAnswer").val();
$("input:checked").each(function () {
var id = $(this).attr("id");
alert("Do something for: " + id + ", " + answer);
});
});
回答by Flimzy
$('input[type=checkbox]:checked').each(function() {
// Do something interesting
});
回答by Bojangles
You'll need to add a class to your checkboxes. After that, use jQuery's .each()method like this:
您需要在复选框中添加一个类。之后，.each()像这样使用jQuery的方法：
HTML
HTML
<input type="checkbox" class="list">
<input type="checkbox" class="list">
<input type="checkbox" class="list">
<input type="checkbox" class="list">
<input type="checkbox" class="list">
jQuery
jQuery
$(document).ready(function()
{
$("form input[type='submit']").click(function(e)
{
e.preventDefault();
// This gets the value of the currently selected option
var value = $(this).children(":selected").val();
$(".list").each(function()
{
if($(this).is(':checked'))
{
$(this).fadeOut();
// Do stuff with checked box
}
else
{
// Checkbox isn't checked
}
})
});
});
EDIT
编辑
Please see this fiddle(code above). I've only implemented the delete option (not very well), but use the valuevariable to check which option is being selected. If you want this to happen before the form is submitted, remove the e.preventDefault()line.
请参阅此小提琴（上面的代码）。我只实现了删除选项（不是很好），但是使用value变量来检查正在选择哪个选项。如果您希望在提交表单之前发生这种情况，请删除该e.preventDefault()行。
回答by Phil.Wheeler
Definitely.
确实。
The first thing you want to do is bind an event handler to your submit event on the form using the $.submit()handler. Next you'll want to iterate over each of the checked input elements:
您要做的第一件事是使用处理程序将事件处理程序绑定到表单上的提交事件$.submit()。接下来，您将要遍历每个选中的输入元素：
$('form').submit(function() {
var action = $('#SelectedAction option:selected', this).val();
$('table input:checkbox:checked').each(function(i){
return doMyCustomFunction(this, action);
});
}
Your custom function ("doMyCustomFunction()" in my example) should return either true or false depending on whether you wanted to submit your form or not.
您的自定义函数（doMyCustomFunction()在我的示例中为“ ”）应返回 true 或 false，具体取决于您是否要提交表单。
By way of a practical example, it might look something like this:
通过一个实际的例子，它可能看起来像这样：
function doMyCustomFunction(el, formAction) {
console.info('The element ID is ' + el.id + ' and the action is ' + formAction);
return true;
}
