为所有表单元素添加只读属性答案

【问题标题】：Adding readonly attribute to all form elements为所有表单元素添加只读属性
【发布时间】：2011-04-30 22:41:51
【问题描述】：

我正在使用 jQuery 为所有表单元素添加只读属性，但似乎无法弄清楚如何做到这一点。

这是我正在尝试的：

$('#form1').each( function() { $(this).attr('readonly', true); });

我有一个使用标签/输入来显示表单元素的简单表单。我也在使用tipsy（工具提示插件）以及Formalize（外观插件）

【问题讨论】：

【解决方案1】：

试试这个：

$('#form1 input').attr('readonly', 'readonly');

您可能希望包含更多元素#form1 input, #form1 textarea, #form1 select
在 jQuery 中，您通常不需要遍历集合。 attr 将适用于与单个元素相同的集合。
在您的情况下，#form1 仅匹配 <form> 元素，并且针对该元素触发了each一次。要查找所有元素（输入或不输入），您可以写#form1 *。

【讨论】：

只是一个技术问题，但“attr('readonly', true)” 比“attr('readonly', 'readonly')”更好。jQuery 的“attr()”方法对 DOM 属性进行操作，不是实际的 HTML 属性，“readonly”的属性值必须是“true”或“false”。恰好在 javascript 中 'readonly' 强制转换为 true，但最好包含布尔值开头。
@Phill，它有多精确不适合你？它什么都不做吗？返回一个js错误？还有什么？
@Ben Lee，我正在使用 FireBug 控制台，我没有看到任何执行错误，查看源代码我没有将 readonly="readonly" 应用于 form1 中的任何输入元素
@Phil - 看看这个例子：jsfiddle.net/8vSKR。尝试发布更多代码，以便我们帮助:)
请注意，输入单选不接受“只读”属性，对于这种元素，您必须使用：$('#form1 input[type=radio]').attr( '禁用'，真）

【解决方案2】：

最好使用input selector。另请注意 Read only 仅适用于 text 和 password 和 textarea 的输入类型。它不适用于选择元素、单选、复选框、按钮。如果您想显示但不允许他们键入或单击。尝试使用禁用。

$("#form1 :input").attr("disabled", true);

注意：使用disabled会使输入、选择或文本区域变灰，但在提交时不会发布此元素。如果您需要它发布，请告诉我，我可以帮助您。

【讨论】：

【解决方案3】：

获取表单的所有元素：

$.each($('form').serializeArray(), function(index, value){
    $('[name="' + value.name + '"]').attr('readonly', 'readonly');
});

【讨论】：

【解决方案4】：

<form>
    <fieldset disabled>
        <input type="text">
        <input type="radio">
        <input type="checkbox">
    </fieldset>
</form>

可能是最好的方法

【讨论】：