Question

我们如何通过javascript禁用html中的所有元素。最简单的方法......

Answer 1

我建议采用“Lightbox”式的方式。

在页面上方添加绝对定位的透明全屏div层。这样，用户甚至无法点击链接。

要向用户提供页面被禁用的视觉反馈，你可以做这个。 G。 50％透明黑色。

BTW，这里也是一个使用类似技术的jQuery Plugin。

Answer 2

最简单的方法是将要禁用的所有表单元素放在<fieldset>中，然后禁用字段集。

示例：http://jsfiddle.net/xdkf9b8j/1/

如果您不想要字段集周围的边框，请按css将其删除。

Answer 3

试试这个，

function disableForm(theform) {
        if (document.all || document.getElementById) {
            for (i = 0; i < theform.length; i++) {
            var formElement = theform.elements[i];
                if (true) {
                    formElement.disabled = true;
                }
            }
        }
    }

否则你也可以试试这个，就像拉耶尔说的那样

function disableForm() {
    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;
    }
}

要停用整个页面，您可以找到一些信息here，

Answer 4

我不知道你为什么需要这个，但这会奏效：

// this will disable all input elements
var elems = document.getElementsByTagName('input');
var len = elems.length;

for (var i = 0; i < len; i++) {
    elems[i].disabled = true;
}

Answer 5

表单中的所有表单元素（输入，选择，文本区域）都可以通过form.elements HTMLCollection访问，您可以迭代禁用每个元素的集合：

function disableForm(form) {
var length = form.elements.length,
    i;
  for (i=0; i < length; i++) {
    form.elements[i].disabled = true;
  }
}

用法示例：

disableForm(document.forms[0]);
disableForm(document.getElementById('formId'));

Answer 6

有一次我必须为我的网站创建一个教程。我需要禁用页面上除了某些元素之外的所有交互。为此，我使用了这种方法：首先确保从页面元素中删除所有事件绑定。您可以使用以下方法执行此操作：

   $('*').unbind();

接下来停用您网页上的所有链接：

   $('a').each(function(){$(this).click(function(){return false;})});

并禁用所有输入：

   $('input').attr('disabled', true);

代码需要在文档末尾执行。顺便说一句，你可以在jquery选择器中排除一些元素以使它们保持活动状态。

Answer 7

只是没有拐杖！

/**
 * Enable/disable all form controlls
 * @param status Status: true - form active, false - form unactive
 */
HTMLFormElement.prototype.setStatus = function (status) {
    for (var i in this.elements) {
        this.elements[i].disabled = !status;
    }
};

// Example:
var my_form = document.getElementById('my_form_with_many_inputs');
my_form.setStatus(false); // Disable all inputs in form
my_form.setStatus(true); // Enable all inputs in form

Answer 8

根据你需要的结果你也可以做

`document.getElementById('main_form').style.display = 'none';`

其中 main_form 是您表单的 ID。您可以使用相同的技术隐藏包含您想要禁用的任何元素的 div。

Answer 9

锁定：

    var controls = document.querySelectorAll("button, input, select, textarea");
    for (var c of controls) {
        c.disabled = true;
    }

解锁：

    var controls = document.querySelectorAll("button, input, select, textarea");
    for (var c of controls) {
        c.disabled = false;
    }

就这么简单。

Answer 10

最好的方法是添加一个具有最高z-index的div，其宽度为：100％，高度为100％。它将覆盖整个页面并使所有不可点击的内容意味着虚拟禁用。这是最好的，因为它不会使用任何循环和任何复杂的代码。

禁用html中的所有元素

10 个答案: