javascript 选中复选框时禁用单选按钮组 jquery
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19973492/
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
disable radio button group when checkbox is checked jquery
提问by Lilz Votca Love
hi to you all i got my code here which i think is right and which is supposed to work fine but it doesn't.i have a radio button group and a checkbox.each of the radio button has a value which will be used as an amount and the checkbox is there only to enable the textbox that will allow the users to enter the amount they want.i made it possible to enable the textbox by checking if it has been checked first.i want to disable the radio group while the checkbox is enabled. here is a screenshot of what my page actually looks like
大家好，我在这里得到了我的代码，我认为它是正确的，应该可以正常工作，但它没有。我有一个单选按钮组和一个复选框。每个单选按钮都有一个值，将用作一个数量和复选框只是为了启用文本框，允许用户输入他们想要的数量。我可以通过检查它是否已被首先选中来启用文本框。我想禁用无线电组，而复选框已启用。这是我的页面实际外观的屏幕截图
here is my html
这是我的 html
<label class="radio-inline" style="margin-left:15%;" >
<input type="radio" id="amount_suggest_1" name="montantdon" value="50 000" onFocus="this.blur()" >
50 000</label>
<label class="radio-inline"><input type="radio" id="amount_suggest_2" name="montantdon" value="25 000" onfocus="this.blur()" >25 000</label>
<label class="radio-inline"><input type="radio" id="amount_suggest_3" name="montantdon" value="10000" onfocus="this.blur()" >10 000</label>
<label class="radio-inline"><input type="radio" id="amount_suggest_4" name="montantdon" value="5000" onfocus="this.blur()" >5000</label>
<label class="radio-inline lastradio"><input type="radio" id="amount_suggest_5" name="montantdon" value="1000" onfocus="this.blur()" checked>1 000</label>
<div class="row" style="padding-left:20px;">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-5" style="width:200px;width:200px;margin:auto;margin-top:2%;">
<div class="input-group input-group-amount" >
<label class=""><input type="checkbox" name="autresdon" id="autresdon" /> Autres</label>
<div style="display:inline-block;vertical-align:top;"><input type="text" style="width:50px;" name="amountentered" id="amountentered" disabled /></div>
<div style="display:inline-block;vertical-align:top;">
<div class="input-group-btn" style="position:relative;">
<button type="button" class="btn btn-default btn-lg dropdown-toggle currency-current" data-toggle="dropdown"><span class="currency" id="currency">EUR-</span> <span class="caret"></span></button>
and here is my jquery code
这是我的 jquery 代码
$('#autresdon').click(function(){//on click the checkbox
if($('#autresdon').is(':checked'))
{
$('#amountentered').prop("disabled",false);//enables textbox
}
else
{
$('#amountentered').prop("disabled",true);//on unset checkbox disable textbox
}
});
//disabling radio group by using their class as selector
$('.montantdon ').click(function(){
if($('#autresdon').is(':checked'))
{
$('#autresdon').prop("checked",false);
}
});
i dont want both data(value of the radios and amount entered manually) to be posted.how can i solve this issue? thanks
我不想同时发布数据（收音机的值和手动输入的数量）。我该如何解决这个问题？谢谢
回答by David says reinstate Monica
If I understand the question correctly, I'd suggest:
如果我正确理解了这个问题，我建议：
// binds the change-handler:
$('#autresdon').change(function(){
// sets the 'disabled' property to false (if the 'this' is checked, true if not):
$('.radio-inline').prop('disabled', !this.checked);
// triggers the change event (so the disabled property is set on page-load:
}).change();
Incidentally, with JavaScript (and especiallyin jQuery, in which it becomes entirely unnecessary) stay awayfrom in-line/obtrusive JavaScript. using onFocus/onfocus, onchange, onclicketc makes for a maintenance nightmare and creates some terribly (and, again, unnecessarily) untidyHTML.
顺便说一句，使用 JavaScript（尤其是在 jQuery 中，它变得完全没有必要）远离内嵌/突兀的 JavaScript。使用onFocus/ onfocus，onchange，onclick等使一个维护恶梦，并创建一些可怕（并且，再次，不必要地）不整洁HTML。
References:
参考：
