javascript 如何默认禁用文本框并稍后启用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15892782/
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
How to I disable the textbox by default and enable it later?
提问by Pey
How to I disable the textbox by default and let the user enable it via checkbox?
如何默认禁用文本框并让用户通过复选框启用它？
<input type="checkbox" id="sccb" name="science" value="science">
<script type="text/javascript">
$(document).ready(function(){
$('#sccb').click(function(){
if (this.checked) {
$('#cns').removeAttr("disabled");
}
else {
$("#cns").attr("disabled", true);
}
});
});
</script>
<input type="text" id="cns" name="coornamescience" disabled="disabled" size="30"></input>
回答by swapnesh
use disabled="disabled"for textbox and then use JS/jQueryto enabled on click
使用disabled="disabled"的文本框，然后使用JS/jQuery上点击启用
Demo - http://jsfiddle.net/jaCmE/
演示 - http://jsfiddle.net/jaCmE/
<textarea rows="4" cols="50" disabled="disabled" id="mytextbox">
</textarea>
<input type="checkbox" id="checkbox1" />
And then use Javascript/jQuerylike this -
然后Javascript/jQuery像这样使用-
$(document).ready(function(){
$('#checkbox1').click(function(){
if (this.checked) {
$('#mytextbox').removeAttr("disabled");
}
else {
$("#mytextbox").attr("disabled", true);
}
});
});
回答by icktoofay
Using JavaScript, first disable the text box. Then add a changeevent handler to the check box. In it, set the disabled state of the text box to the opposite of the checked status.
使用 JavaScript，首先禁用文本框。然后将change事件处理程序添加到复选框。在其中，将文本框的禁用状态设置为与选中状态相反的状态。
回答by Bryce
You can you javascript to disable the textbox on page load, then add an event to the checkbox to re-enable the textbox.
您可以使用 javascript 在页面加载时禁用文本框，然后向复选框添加一个事件以重新启用文本框。
回答by Hktrm
<script type="text/javascript">
function disenable(e) {
e[0].disabled = e[1].checked ? "" : "disabled"
}
</script>
<form action="">
<input type="text" disabled="disabled"><br>
<input type="checkbox" onchange="disenable(this.form)">Click me
</form>
Here e is the form, e[0] is the first input (the textbox) and e[1] is the second input (the checkbox). When the checkbox changes it calls disenable passing the form as input, the function erases or sets the textbox's disabled argument besed on it's checked status.
这里 e 是表单，e[0] 是第一个输入（文本框），e[1] 是第二个输入（复选框）。当复选框更改时，它调用禁用将表单作为输入传递，该函数会根据其选中状态擦除或设置文本框的禁用参数。
回答by bruhbruh
You could use jquery to target the checkbox and if the checkbox is enabled then the textbox is disabled and vice versa. Html:
您可以使用 jquery 来定位复选框，如果启用了复选框，则禁用文本框，反之亦然。网址：
<form action="">
<input type="text" name="box" id="mytext" />
<input type="checkbox" name="check" id="mycheckbox" />
</form>
Js:
JS：
$(function(){
//Disable the textbox
var textbox = $('#mytext');
textbox.attr("disabled","disabled");
$('#mycheckbox').change(function(){
//Enable input
if(textbox.attr('disabled')){
$('#mytext').removeAttr('disabled');
}else {
textbox.attr("disabled","disabled");
}
});
});
Here's the illustration on JsFiddle: http://jsfiddle.net/X5TVx/
这是 JsFiddle 上的插图：http: //jsfiddle.net/X5TVx/
回答by RobG
As icktoofay said, leave it enabled in the markup, then disable it using script.
正如 icktoofay 所说，在标记中启用它，然后使用脚本禁用它。
<input type="text" id="i0">
<label for="cb0"><input id="cb0" type="checkbox">Check to enable</label>
<script>
document.getElementById('i0').disabled = true;
document.getElementById('cb0').onclick = function() {
document.getElementById('i0').disabled = !this.checked;
};
</script>
