jQuery 单击单选按钮时禁用文本框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17248752/
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 textbox on radio button click
提问by Devendra526
I have two radio buttons. each radio button has two TextBox I just want to do if first radio button is clicked then other radio button containing textboxes should be disabled and vice versa.
我有两个单选按钮。每个单选按钮都有两个 TextBox 我只想在单击第一个单选按钮然后其他包含文本框的单选按钮时禁用它，反之亦然。
回答by ikhsan
you can use jquery click event, combined with :checked filter
您可以使用 jquery click 事件，结合 :checked 过滤器
try this fiddle http://jsfiddle.net/8NynQ/
试试这个小提琴http://jsfiddle.net/8NynQ/
<div>
<label for="radio1">
<input type="radio" name="test" value="radio1" /> Radio 1
</label>
<input type="text" name="for_radio1[]" class="radio1" disabled="true" />
<input type="text" name="for_radio1[]" class="radio1" disabled="true" />
<label for="radio2">
<input type="radio" name="test" value="radio2" /> Radio 2
</label>
<input type="text" name="for_radio2[]" class="radio2" disabled="true" />
<input type="text" name="for_radio2[]" class="radio2" disabled="true" />
</div>
and here is the js
这是js
$(document).ready(function(){
$('input[type=radio][name=test]').click(function(){
var related_class=$(this).val();
$('.'+related_class).prop('disabled',false);
$('input[type=radio][name=test]').not(':checked').each(function(){
var other_class=$(this).val();
$('.'+other_class).prop('disabled',true);
});
});
});
回答by Stano
Example:
例子：
HTML
HTML
<form id="myform" name="myform" action="" method="post">
<input type="radio" name="group1" value="Milk" checked="checked" />Milk
<input type="text" name="text1" value="milk1" />
<input type="text" name="text2" value="milk2" />
<br/>
<input type="radio" name="group1" value="Cheese" />Cheese
<input type="text" name="text3" value="cheese1" disabled="disabled" />
<input type="text" name="text4" value="cheese2" disabled="disabled" />
</form>
Javascript
Javascript
var form = document.forms['myform'];
form.group1[0].onfocus = function () {
form.text1.disabled = form.text2.disabled = false;
form.text3.disabled = form.text4.disabled = true;
}
form.group1[1].onfocus = function () {
form.text1.disabled = form.text2.disabled = true;
form.text3.disabled = form.text4.disabled = false;
}
回答by Flame Trap
Is this what you mean?
你是这个意思吗？
HTML:
HTML：
<input type="radio" id="textbox1" onclick="check(this.id)" checked="true" />
<textarea id="textarea1"></textarea>
<br>
<input type="radio" id="textbox2" onclick="check(this.id)"/>
<textarea id="textarea2" disabled="true"></textarea>
Javascript:
Javascript：
function check(id) {
var thistextbox = id.replace('box', 'area');
var othertextarea = 'textarea1';
if(id.slice(-1) == '1'){
othertextarea = 'textarea2';
}
var othertextbox = othertextarea.replace('area', 'box');
document.getElementById(id).checked = true;
document.getElementById(thistextbox).disabled = false;
document.getElementById(othertextarea).disabled = true;
document.getElementById(othertextbox).checked = false;
}
}
