Javascript 启用/禁用输入元素的脚本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6835165/
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
Script to enable/disable input elements?
提问by Charlie
I'm wondering if it's possible for a script to enable/disable all input elements on the page with some sort of toggle button.
我想知道脚本是否可以使用某种切换按钮启用/禁用页面上的所有输入元素。
I googled it but didn't find anything too useful except for this:
我用谷歌搜索但没有发现任何有用的东西，除了这个：
http://www.codetoad.com/javascript/enable_disable_form_element.aspbut I'm not sure how to edit it for the toggle.
http://www.codetoad.com/javascript/enable_disable_form_element.asp但我不确定如何为切换编辑它。
采纳答案by samccone
A working example:
一个工作示例：
$().ready(function() {
$('#clicker').click(function() {
$('input').each(function() {
if ($(this).attr('disabled')) {
$(this).removeAttr('disabled');
}
else {
$(this).attr({
'disabled': 'disabled'
});
}
});
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<input type='text'></input>
<input type='text'></input>
<input type='text'></input>
<div id='clicker' style='background-color:#FF0000; height:40px; width:100px;'></div>回答by Adam MacDonald
Something like this would work:
像这样的事情会起作用：
var inputs=document.getElementsByTagName('input');
for(i=0;i<inputs.length;i++){
inputs[i].disabled=true;
}
回答by Reid
Here is a function to toggle all inputs on the page:
这是一个切换页面上所有输入的函数：
function toggle_inputs() {
var inputs = document.getElementsByTagName('input');
for (var i = inputs.length, n = 0; n < i; n++) {
inputs[n].disabled = !inputs[n].disabled;
}
}
It works by using the logical NOT operator(the exclamation point), which returns the opposite of the operand. For example, !truewill return false. So by using !inputs[n].disabled, it will return the opposite of what it's currently set to, thereby toggling it.
它通过使用逻辑 NOT 运算符（感叹号）来工作，它返回操作数的相反数。例如，!true将返回false. 因此，通过使用!inputs[n].disabled，它将返回与当前设置相反的值，从而切换它。
If you need code to bind the click event to the button:
如果您需要代码将点击事件绑定到按钮：
document.getElementById('your_button_id').onclick = toggle_inputs;
You can also use addEventListener, but see the linked page for more information, including compatibility with Internet Explorer. The code I gave above should work across all browsers with no trouble.
您也可以使用addEventListener，但请参阅链接页面了解更多信息，包括与 Internet Explorer 的兼容性。我上面给出的代码应该可以在所有浏览器上正常工作。
回答by Wulf
for (var i = 0; i < document.getElementyByTagName('input').length; i++) {
document.getElementsByTagName('input')[i].disabled = 'disabled';
}
回答by Steve
http://code.google.com/p/getelementsbyclassname/
http://code.google.com/p/getelementsbyclassname/
^^Robert Nyman has a "get elements by class" script. Basically you'd just assign all those input elements to the same class, and then do something like:
^^Robert Nyman 有一个“按类获取元素”脚本。基本上，您只需将所有这些输入元素分配给同一个类，然后执行以下操作：
//Collapse all the nodes
function collapseNodesByClass(theClass){
var nodes = getElementsByClassName(theClass);
for(i = 0; i < nodes.length; i++){
nodes[i].style.display='none';
}
}
This is a piece of code I'm actually currently using to collapse everything with a given class name (it uses the script I mentioned above). But in any case I think the key to your problem is being able to refer to multiple elements at once, which that script will help you with.
这是我目前实际使用的一段代码，用于折叠具有给定类名的所有内容（它使用我上面提到的脚本）。但无论如何，我认为您的问题的关键是能够一次引用多个元素，该脚本将对您有所帮助。
Also the link in your question didn't work for me :(.
此外，您问题中的链接对我不起作用:(。
