将readonly属性添加到所有表单元素

Question

我正在使用jQuery为所有表单元素添加readonly属性，但似乎无法弄清楚如何执行此操作。

以下是我正在尝试的内容：

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

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

Answer 1

试试这个：

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

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

Answer 2

这更好用input selector。另请注意，“只读”仅适用于输入类型的文本和密码以及textarea。它不适用于选择元素，收音机，复选框，按钮。如果要显示但不允许他们键入或单击。尝试使用禁用。

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

注意：通过使用禁用它会使输入变灰，选择或textarea但在提交时不会发布此元素。如果你需要它发布让我知道，我可以帮助你。

这是demo http://jsfiddle.net/j5PAn/

Answer 3

获取表单的所有元素：

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

Answer 4

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

可能是最好的方法