提交前 JQuery 需要复选框和单选按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/849155/
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 Require Checkbox and Radio Button before submit
提问by Buddy Lindsey
I am having one heck of a hard time trying to figure this out. Been looking at examples and tools for JQuery validation for over 3 hours now.
我很难弄清楚这一点。3 个多小时以来一直在研究 JQuery 验证的示例和工具。
All I want to do is require that a checkbox is selected and a radio button, but I don't care which one is required.
我想要做的就是要求选中一个复选框和一个单选按钮，但我不在乎需要哪一个。
<form id="form1" action="/controller/action" method="post">
<div class="checkbox"><input type="checkbox" name="box1" class="cBox" /><label for="box1" class="label">Box1</label></div>
<div class="checkbox"><input type="checkbox" name="Box2" class="cBox" /><label for="Box2" class="label">Box2</label></div>
<div class="checkbox"><input type="checkbox" name="Box3" class="cBox" /><label for="Box3" class="label">Box3</label></div>
<div class="radio"><input type="radio" name="print" value="Radio1" class="rad" /><label class="label">Radio1</label></div>
<div class="radio"><input type="radio" name="print" value="Radio2" class="rad" /><label class="label">Radio2</label></div>
<div class="radio"><input type="radio" name="print" value="Radio3" class="rad" /><label class="label">Radio3</label></div>
<input type="submit" value="Submit" />
</form>
Any help would be greatly appreciated.
任何帮助将不胜感激。
回答by Paolo Bergantino
To do this you have to use the :checkedselector. Although JP's answer is fine, I'd probably do this:
为此，您必须使用:checked选择器。虽然 JP 的回答很好，但我可能会这样做：
$('#form1').submit(function() {
if ($('input:checkbox', this).is(':checked') &&
$('input:radio', this).is(':checked')) {
// everything's fine...
} else {
alert('Please select something!');
return false;
}
});
Couple of notes:
几个注意事项：
- I think it reads better to use the
isfunction, which returns a boolean of the selector. - You can use
:radioand:checkboxas a shortcut for selecting all radios and checkboxes in a form. However, according to the jQuery manual, it is bad practice to use these selectors without specifyinginputbefore them, as they evaluate to*:checkboxand*:radiootherwise, which are very slow selectors. - By passing
thisas the second argument we are specifying a contextfor the search, and thus are only searching for checkboxes and radio inputs inside the current form. Without it we might get false positives if there happens to be another form in the page.
回答by James
$('#form1').submit(function(){
if ($(':checkbox:checked', this)[0] && $(':radio:checked', this)[0]) {
// everything's fine...
} else {
alert('Please select something!');
return false;
}
});
回答by Mark Hudson
This worked for me in my case where I want to require users to check a checkbox in order to submit a form.
在我希望要求用户选中复选框以提交表单的情况下，这对我有用。
$(document).ready(function(){
$('#yourinput').required = true;
});
