javascript 复选框禁用/启用输入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4475673/
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
checkbox to disable/enable input
提问by 422
I am using js to , onclick of a checkbox, it enables or disables text input.
我正在使用 js 来单击复选框，它启用或禁用文本输入。
It works, until I put it into a live form with google jquery api.
它有效，直到我使用 google jquery api 将其放入实时表单中。
Weird but.. must be a conflict somewhere.
很奇怪，但是……一定是某个地方发生了冲突。
The form element is: ( code isnt adding to this post properly )
表单元素是：（代码没有正确添加到这篇文章中）
<input type="checkbox" name="others" onclick="enable_text(this.checked)" class="medium" /></div>
Name on credit card if different from above
如果与上述不同，信用卡上的姓名
The js is:
js是：
function enable_text(status)
{
status=!status;
document.form1.other_name.disabled = status;
}
What am I doing wrong, I have used body onload handler.
我做错了什么，我使用了 body onload 处理程序。
<body onload=enable_text(false);>
JS FIDDLE : http://www.jsfiddle.net/ozzy/H8VPY/4/
回答by ?ime Vidas
Here, a jQuery solution:
在这里，一个 jQuery 解决方案：
$("input:checkbox").click(function() {
$("input:text").attr("disabled", !this.checked);
});
Just replace these generic selectors with your more specific ones.
只需将这些通用选择器替换为更具体的选择器即可。
In addition to this code, you will probably also want to make the text-box disabled (initially).
除了此代码之外，您可能还希望禁用文本框（最初）。
<input type="text" disabled="disabled" />
Working demo:http://www.jsfiddle.net/H8VPY/11/
工作演示：http : //www.jsfiddle.net/H8VPY/11/
回答by BalusC
There are several problems in your jsfiddle demo.
您的 jsfiddle 演示中有几个问题。
- The
<script>and the comment there around should be removed. - A
<form name="form1">is missing which causeddocument.form1to return nothing. - The onLoadoption on left menu should be a no wrap (head)since it's just a function.
- 在
<script>和注释有没有解决应该被删除。 - A
<form name="form1">丢失导致document.form1什么都不返回。 - 左侧菜单上的onLoad选项应该是无换行（头部），因为它只是一个函数。
Updated demo: http://www.jsfiddle.net/PPZYm/
回答by subhaze
function enable_text(status) {
status = (status) ? false : true; //convert status boolean to text 'disabled'
document.form1.other_name.disabled = status;
}
Note
笔记
You also need to wrap your divin the jsfiddle example with a <form>tag with the name form1for it to properly work
您还需要div在 jsfiddle 示例中使用<form>带有名称的标签来包装form1它才能正常工作
<div class="controlset-pad">
<input type="checkbox" name="others" onclick="enable_text(this.checked)" class="medium" />
</div>
<form name="form1">
<div class="field4">
<label>Name on credit card if different from above</label><input type="text" name="other_name" class="medium" disabled="disabled" />
</div>
</form>
