javascript 仅当单击 1 个单选按钮时启用文本框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21752408/
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
Enable a text box only when 1 of the radio button is clicked
提问by user3286350
I have 2 radio button ie yes and no. When I select yes the text box as to get enabled. When i click no the text box as to be disabled. How to enable the text box when I click on Yes. Here is the code. Please tel me how to enable and disable it using javascript.
我有 2 个单选按钮，即是和否。当我选择是时，文本框将被启用。当我单击“否”时，文本框将被禁用。单击“是”时如何启用文本框。这是代码。请告诉我如何使用 javascript 启用和禁用它。
<script type="text/javascript">
$(function() {
$("#XISubmit").click(function(){
var XIyop= document.forms["XIForm"]["XIyop"].value;
var XIForm = $('form[name=XIForm]');
var XIAlmnus = XIForm.find('input[name=XIAlmnus]:checked').val();
if (XIAlmnus == null || XIAlmnus == "")
{
alert("Please select Parent is an Alumnus (old Boy) of this school");
return false;
}
document.getElementById("XIForm").submit();
});
</script>
<!-- html code-->
<html>
...
<label>Parent is an Alumnus (old Boy) of this school </label>   
<input type='radio' name='XIAlmnus' value='Yes' id="XIyes"/>Yes
<input type='radio' name='XIAlmnus' value='No' id="XIno"/>No</td>
<label>If Yes, Year of passing </label>   
<input type="textbox" name="XIyop" id="XIyop" >
...
</html>
回答by Maksim Gladkov
I think, you should use some general handler for this: http://jsfiddle.net/maximgladkov/MvLXL/
我认为，您应该为此使用一些通用处理程序：http: //jsfiddle.net/maximgladkov/MvLXL/
$(function() {
window.invalidate_input = function() {
if ($('input[name=XIAlmnus]:checked').val() == "Yes")
$('#XIyop').removeAttr('disabled');
else
$('#XIyop').attr('disabled', 'disabled');
};
$("input[name=XIAlmnus]").change(invalidate_input);
invalidate_input();
});
回答by Tijo K Varghese
first make the text box disabled.
首先禁用文本框。
<input type="textbox" name="XIyop" id="XIyop" disabled>
When radio button clicked, check and enable it.
单击单选按钮时，检查并启用它。
if(document.getElementById('XIyes').checked) {
document.getElementById("XIyop").disabled = false;
}else if(document.getElementById('XIno').checked) {
document.getElementById("XIyop").disabled = true;
}
回答by Amb
$(function() {
$('input[name="XIAlmnus"]').on('change', function() {
if ($(this).val() == 'Yes') {
$("#XIyop").prop('disabled', false);
} else {
$("#XIyop").prop('disabled', true);
}
});
});
<input type="textbox" name="XIyop" id="XIyop" disabled>
回答by Kaptan
if(document.getElementById('XIyes').attr('checked')) {
document.getElementById("XIyop").disabled = 'true';
}
if(document.getElementById('XIno').attr('checked')) {
document.getElementById("XIyop").disabled = 'false';
}
回答by Mithlesh Kumar
HTML:
HTML：
<label>Parent is an Alumnus (old Boy) of this school </label>   
<input type='radio' name='XIAlmnus' value='Yes' id="XIyes"/>Yes
<input type='radio' name='XIAlmnus' value='No' id="XIno"/>No
<br/>
<label>If Yes, Year of passing </label>   
<input type="textbox" name="XIyop" id="XIyop" disabled>
JS:
JS：
document.getElementById('XIyes').onchange = displayTextBox;
document.getElementById('XIno').onchange = displayTextBox;
var textBox = document.getElementById('XIyop');
function displayTextBox(evt){
if(evt.target.value=="Yes"){
textBox.disabled = false;
}else{
textBox.disabled = true;
}
}
Please see working demo here. Thank you I hope this will help you.
请在此处查看工作演示。谢谢我希望这会帮助你。
