使用 jQuery 禁用单选按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1406544/
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
Disabling radio buttons with jQuery
提问by user46785
I'm trying to disable these radio buttons when a the loadActive link is clicked but for some reason it only disables the first in the order and then skips the rest.
我试图在单击 loadActive 链接时禁用这些单选按钮，但由于某种原因，它只禁用顺序中的第一个，然后跳过其余的。
<form id="chatTickets" method="post" action="/admin/index.cfm/">
<input id="ticketID1" type="radio" checked="checked" value="myvalue1" name="ticketID"/>
<input id="ticketID2" type="radio" checked="checked" value="myvalue2" name="ticketID"/>
</form>
<a href="#" title="Load ActiveChat" id="loadActive">Load Active</a>
And Here is the jquery i'm using:
这是我正在使用的 jquery：
jQuery("#loadActive").click(function() {
//I have other code in here that runs before this function call
writeData();
});
function writeData() {
jQuery("input[name='ticketID']").each(function(i) {
jQuery(this).attr('disabled', 'disabled');
});
}
回答by karim79
I've refactored your code a bit, this should work:
我已经重构了你的代码，这应该可以工作：
jQuery("#loadActive").click(writeData);
function writeData() {
jQuery("#chatTickets input:radio").attr('disabled',true);
}
If there are more than two radio buttons on your form, you'll have to modify the selector, for example, you can use the starts with attribute filterto pick out the radios whose ID starts with ticketID:
如果表单上有两个以上的单选按钮，则必须修改选择器，例如，您可以使用带有属性的过滤器来挑选 ID 以 开头的单选按钮ticketID：
function writeData() {
jQuery("#chatTickets input[id^=ticketID]:radio").attr('disabled',true);
}
回答by KCOtzen
Remove your "each" and just use:
删除您的“每个”并使用：
$('input[name=ticketID]').attr("disabled",true);
That simple. It works
就那么简单。有用
回答by mkoryak
First, the valid syntax is
首先，有效的语法是
jQuery("input[name=ticketID]")
second, have you tried:
第二，你有没有试过：
jQuery(":radio")
instead?
反而？
third, why not assign a class to all the radio buttons, and select them by class?
第三，为什么不给所有的单选按钮分配一个类，并按类选择它们？
回答by mostafaznv
just use jQuery prop
只需使用 jQuery prop
$(".radio-button").prop("disabled", false);
$(".radio-button").prop("disabled", true); // disable
回答by geowa4
I just built a sandbox environment with your code and it worked for me. Here is what I used:
我刚刚用你的代码构建了一个沙箱环境，它对我有用。这是我使用的：
<html>
<head>
<title>test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<form id="chatTickets" method="post" action="/admin/index.cfm/">
<input id="ticketID1" type="radio" checked="checked" value="myvalue1" name="ticketID"/>
<input id="ticketID2" type="radio" checked="checked" value="myvalue2" name="ticketID"/>
</form>
<a href="#" title="Load ActiveChat" id="loadActive">Load Active</a>
<script>
jQuery("#loadActive").click(function() {
//I have other code in here that runs before this function call
writeData();
});
function writeData() {
jQuery("input[name='ticketID']").each(function(i) {
jQuery(this).attr('disabled', 'disabled');
});
}
</script>
</body>
</html>
I tested in FF3.5, moving to IE8 now. And it works fine in IE8 too. What browser are you using?
我在 FF3.5 中进行了测试，现在转向 IE8。它在 IE8 中也能正常工作。你使用的是什么浏览器？
回答by ranonE
code:
代码：
function writeData() {
jQuery("#chatTickets input:radio[id^=ticketID]:first").attr('disabled', true);
return false;
}
See also: Selector/radio, Selector/attributeStartsWith, Selector/first
另见：Selector/radio、Selector/attributeStartsWith、Selector/first
回答by rogeriopvl
You should use classes to make it more simple, instead of the attribute name, or any other jQuery selector.
您应该使用类使其更简单，而不是使用属性名称或任何其他 jQuery 选择器。
回答by Saddam Khan
You can try this code.
你可以试试这个代码。
var radioBtn = $('<input type="radio" name="ticketID1" value="myvalue1">');
if('some condition'){
$(radioBtn).attr('disabled', true); // Disable the radio button.
$('.span_class').css('opacity', '.2'); // Set opacity to .2 to mute the text in front of the radio button.
}else{
$(radioBtn).attr('disabled', false);
$('.span_class').css('opacity', '1');
}
