TL; DR：

Question

我正在尝试使用JavaScript定位多个ID，以便我可以为它们禁用输入字段。使用以下脚本似乎非常简单，但我注意到在中间元素不存在的页面上，脚本不会禁用第三个（就好像它在找不到第二个元素时停止工作一样）。 / p>

<script>
document.getElementById("id_1").disabled = true;
document.getElementById("id_2").disabled = true;
document.getElementById("id_3").disabled = true;
</script>

因此，在存在所有3个ID的页面上，脚本完美运行。但是在不存在“id_1”或“id_2”的页面上，即使它们存在，其余元素也不会被禁用。

有什么方法吗？请注意，我无法为每个页面创建单独的脚本，因为这将显示在所有页面相同的页脚中。

谢谢！

Answer 1

您应首先测试存在，然后在存在时将其禁用。我还将id放在一个数组中以简化代码。

＆＃13;

var ids = ['id_1','id_2','id_3'];

for (var i = 0; i < ids.length; i++) {
  var el = document.getElementById(ids[i]);
  el && (el.disabled = true);
}

＆＃13;

<input id="id_1" value="id_1">
<input id="id_3" value="id_3">

＆＃13;

Answer 2

这是因为document.getElementById在找不到元素时返回null，因此在尝试将null设置为null时会有效地导致异常。当DOM中没有设置其中一个元素时就是这种情况。您需要做的是检查元素是否已被正确找到然后设置元素或循环遍历它们。

Answer 3

TL; DR：

脚本停止工作的原因是当您尝试禁用不存在的元素时会抛出错误。

详细信息：

如果您尝试查找的元素不存在（Here's the MDN page），则

document.getElementById()将返回null。

当您尝试在.disabled上将true属性设置为null时，JavaScript会抛出TypeError。除非使用try / catch块处理该错误，否则将导致脚本停止执行，后续输入元素将不会被禁用。

解决方案

要解决此问题，您需要在尝试将其设置为禁用之前检查您的元素是元素。像这样：

var el = document.getElementById('id_1');

if ('null' !== typeof el) {
  el.disabled = true;
}

如果使用Javascript定位多个元素Id并且找不到其中一个，则会出错

3 个答案:

TL; DR：

详细信息：

解决方案