jQuery：根据名称和值选择复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1448988/
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: select checkbox based on name and value
提问by MrG
I have the following HTML:
我有以下 HTML：
<form id="test">
<input type="radio" value="A" name="C1"/>
<a href="javascript:selectCheckbox('C1', 'A');"> OPTION-A </a>
<input type="radio" value="B" name="C1"/>
<a href="javascript:selectCheckbox('C1', 'B');"> OPTION-B </a>
<input type="radio" value="C" name="C1"/>
<a href="javascript:selectCheckbox('C1', 'C');"> OPTION-C </a>
// several other: C2, C3, ..
</form>
And I'm trying to implement selectCheckbox( chkbox, value), which should:
我正在尝试实施selectCheckbox( chkbox, value)，它应该：
- search for all radio's with
name = chkboxand setattr('checked') = false - search for the radio having
name = chkbox AND val() = valueand setattr('checked') = true
- 搜索所有带有
name = chkbox和设置的收音机attr('checked') = false - 搜索具有
name = chkbox AND val() = value并设置的收音机attr('checked') = true
I can't figure out, what the right selector is, I tried the following without any luck:
我不知道正确的选择器是什么，我尝试了以下方法但没有任何运气：
var name = "#" + chkbox + " :checked";
$(name).each(.. // doesn't work
$('#'+chkbox).each( .. // if finds only the first occurence
// of i.e. C1, although I would expect 3
$("input[@name='"+chkbox+"']").each( function() { ..
// leaves me with the following error:
// Warning: Expected attribute name or namespace but found '@name'
Please let me know what I'm doing wrong. Many, many thanks!
请让我知道我做错了什么。非常感谢！
采纳答案by tvanfosson
I'd use relative DOM position to do the navigation. Note also you can't have different elements with the same id, but in this case it isn't necessary since you can use the attribute selector on the name to find the correct inputs. Note that you already know which of the various inputs need to be checked based on the position of the link that is clicked. I prefer to have the code separate from the markup so I've given the links a class to make them easy to select and moved the click handler application into the code.
我会使用相对 DOM 位置来进行导航。另请注意，您不能拥有具有相同 id 的不同元素，但在这种情况下，没有必要，因为您可以使用名称上的属性选择器来查找正确的输入。请注意，您已经知道需要根据单击链接的位置检查各种输入中的哪些。我更喜欢将代码与标记分开，因此我为链接提供了一个类，使它们易于选择并将单击处理程序应用程序移到代码中。
Update: Note that I removed the code to uncheck the other radios. With radios, setting one to checked should automatically uncheck any of the others.
更新：请注意，我删除了取消选中其他收音机的代码。对于收音机，将其中一个设置为选中应该会自动取消选中其他任何一个。
$(function() {
$('a.checkbox-selector').click( function() {
// get the checkbox immediately preceding the link -- this should
// be checked. Checking it should automatically uncheck any other
// that may be checked.
$(this).prev(':checkbox');
.attr('checked',true);
return false; // don't process the link
});
});
<form id="test">
<input type="radio" value="A" name="C1"/>
<a href="#" class="checkbox-selector"> OPTION-A </a>
<input type="radio" value="B" name="C1"/>
<a href="#" class="checkbox-selector"> OPTION-B </a>
<input type="radio" value="C" name="C1"/>
<a href="#" class="checkbox-selector"> OPTION-C </a>
<!-- several other: C2, C3, ... -->
</form>
回答by Rohan
Try this:
尝试这个：
$('input:radio[name="' + chkboxName + '"][value="' + value + '"]')
.attr('checked', 'checked');
回答by MrG
Thanks for your help, I finally got it:
感谢您的帮助，我终于明白了：
function selectTestAnswer( chkbox, value ) {
$("[name="+chkbox+"]").each( function() {
if ( $(this).val() == value )
$(this).attr('checked', true);
else
if ( $(this).attr('checked') == true)
$(this).attr('checked', false);
});
}
}
回答by Midhun
You can use prop() instead of attr() if your jquery version > 1.6
如果您的 jquery 版本 > 1.6，您可以使用 prop() 而不是 attr()
Refer this link http://api.jquery.com/prop/
请参阅此链接 http://api.jquery.com/prop/
As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.
从 jQuery 1.6 开始， .prop() 方法提供了一种显式检索属性值的方法，而 .attr() 方法检索属性。
So the code you are looking for looks more like
所以你正在寻找的代码看起来更像
$('input:checkbox[name="Validators"][value="' + v + '"]').prop('checked',true);
回答by stefanw
You can't have multiple elements with the same id on one page. All your input-elements have the id "C1".
一个页面上不能有多个具有相同 id 的元素。您所有的输入元素的 ID 为“C1”。
回答by Zed
Try $("input[name='C1'] :checked]"). IDs should be unique, so jquery probably doesn't expect to return more than one element.
试试$("input[name='C1'] :checked]")。ID 应该是唯一的，因此 jquery 可能不期望返回多个元素。
