logo标签列表

如何使用JavaScript/jQuery禁用表单内的所有元素？

javascriptjqueryreadonly
63

我有一个弹出在层中的表单，我需要使该表单中的所有输入框都变为只读。有什么办法可以做到吗？

17个回答
0
我喜欢这种方法，但带有“disabled”属性。
$("#myForm :input").prop('disabled', true);

那样，所有的表单字段、单选框、复选框、文本字段、文本区域 - 包括隐藏的表单字段 - 都会一次性禁用。
如果你在不同的表单之间切换，这非常方便。
-1
// get the reference to your form 
// you may need to modify the following block of code, if you are not using ASP.NET forms  
var theForm = document.forms['aspnetForm'];
if (!theForm) {
 theForm = document.aspnetForm;
}

// this code disables all form elements  
var elements = theForm.elements;
for (var i = 0, len = elements.length; i < len; ++i) {
 elements[i].disabled = true;
}
-1

Javascript：禁用所有表单字段：

function disabledForm(){
  var inputs = document.getElementsByTagName("input"); 
    for (var i = 0; i < inputs.length; i++) { 
        inputs[i].disabled = true;
    } 
     var selects = document.getElementsByTagName("select");
     for (var i = 0; i < selects.length; i++) {
         selects[i].disabled = true;
     }
    var textareas = document.getElementsByTagName("textarea"); 
    for (var i = 0; i < textareas.length; i++) { 
        textareas[i].disabled = true;
    }
    var buttons = document.getElementsByTagName("button");
    for (var i = 0; i < buttons.length; i++) {
        buttons[i].disabled = true;
    }    
}

要启用表单的所有字段，请参考下面的代码

function enableForm(){
      var inputs = document.getElementsByTagName("input"); 
        for (var i = 0; i < inputs.length; i++) { 
            inputs[i].disabled = false;
        } 
         var selects = document.getElementsByTagName("select");
         for (var i = 0; i < selects.length; i++) {
             selects[i].disabled = false;
         }
        var textareas = document.getElementsByTagName("textarea"); 
        for (var i = 0; i < textareas.length; i++) { 
            textareas[i].disabled = false;
        }
        var buttons = document.getElementsByTagName("button");
        for (var i = 0; i < buttons.length; i++) {
            buttons[i].disabled = false;
        }    
    }
-1

根据Tim Down的回答，我建议：

const FORM_ELEMENTS = document.getElementById('idelementhere').elements;
for (i = 0; i < FORM_ELEMENTS.length; i++) {
    FORM_ELEMENTS[i].disabled = true;
}

这将禁用表单内的所有元素。

-1

这个方法从未让我失望，而且我在其他答案中也没有看到过这种方法。

//disable inputs
$.each($("#yourForm").find("input, button, textarea, select"), function(index, value) {
  $(value).prop("disabled",true);
 });

-3

虽然这篇文章非常老，但是我认为还是有价值的。这不是只读方法，但对我来说很有效。我使用form.hidden = true。

2
你好，欢迎来到StackOverFlow。无论问题有多久，您的知识始终是宝贵且受人赞赏的。请提供更多关于您的答案为什么以及如何工作的详细信息。祝你好运。 - Ali Kianoor
var form = document.getElementById("your_form_id"); var elements = form.elements; for (var i = 0, len = elements.length; i < len; ++i) { elements[i].readOnly = true; }变量表单= document.getElementById("your_form_id"); 元素= form.elements; 对于(var i = 0, len = elements.length; i < len; ++i) { 元素[i].readOnly = true; } - Andrés Lescano
-6

谢谢 Tim，

那真的很有帮助。 当我们处理控件事件时，我稍微进行了一些调整。

 var form = document.getElementById("form");
                var elements = form.elements;
                for (var i = 0, len = elements.length; i < len; ++i) {
                    elements[i].setAttribute("onmousedown", "");
                }
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接