Javascript 如何一次为多个标记设置属性

我将如何设置3个单独的输入标记以同时禁用？在用户输入时间后，我想禁用输入字段，然后在时间用完时启用它们。我知道如何添加逻辑，我只是很难一次将“disabled”添加到所有逻辑中

<div id="inputFields">
    <h3>Enter Time</h3>
    <input id="hours" type="text" value="" name="hours" placeholder="Hours" maxlength="2"> <span>:</span>
    <input id="minutes" type="text" value="" name="min" placeholder="Minutes" maxlength="2"> <span>:</span>
    <input id="seconds" type="text" value="" name="seconds" placeholder="Seconds" maxlength="2">
</div>

输入时间
:
:

---

我需要在它们之间循环吗？或者我可以作为#inputFields的子项访问它们吗？或者两者都没有？如果您使用jQuery，我们将不胜感激……谢谢。

：

$('#inputFields > input').prop('disabled', true);

它为每个

输入设置属性，这些输入是
#inputFields
的直接后代

另一种选择：

$('#hours,#minutes,#seconds').prop('disabled', true);

或者如果使用纯Javascript：

['hours', 'minutes', 'seconds'].forEach(function (elemId) {
    document.getElementById(elemId).setAttribute('disabled', true);
});

也应该很好。这与您可以获得的“一次完成所有任务”非常接近。
这里有一种循环完成任务的方法，您可以使用它们执行任何操作

$('#inputFields').children('input').each(function () {
    alert(this.value);
});

e、 g

不必将
输入
元素打包到
div
，您可以正确地将它们作为
表单
元素的子元素

这样做的好处是，HTML中已经有一个
表单
元素的集合，您可以使用
document.forms[]
或只使用
表单[]
在JavaScript中轻松访问这些元素，以及它们的子元素
表单[].elements[]

表单及其子元素可以通过其索引或
name
属性调用，如下所示

 var firstInput = forms['myInputForm'].elements[0];

例如，这样您就可以循环浏览此选择并执行所需的任何更改

编辑

鉴于此，您的
输入
元素确实有一个
名称
属性，您可以这样编写它

['hours', 'min', 'seconds'].forEach(function (name) {

  document.forms['inputFields'].elements[name].setAttribute('disabled', true);

});

在脚本和
中，而不是HTML中的
div

对于包含
input
元素，
form
元素比
div
元素更适合，并且，如前所述，您不必在整个DOM中搜索
input
元素，因为已经有一个HTML集合，您可以使用JavaScript以上述方式访问。
您必须循环访问它们。使用jquery可以执行：$（'小时，'分钟，'秒'）。attr（'禁用'，'禁用'）；只需使用
.disabled=true
。（
prop（'disabled'，true）
也更正确。）@minitech关于
prop（）
你说得对，我会编辑它。对于
.disabled
，我不太确定，我想我更喜欢
setAttribute（）
它使代码更容易阅读。不知道为什么你的答案被否决了，因为你提出了另一种正确的方法。我把你的票数提高到0。这发生在stackoverflow。。。当我添加答案时，没有答案，当我按下“添加答案”时，有人向我打赌2秒钟左右。下一个人认为我抄袭了它并否决了它？
['hours', 'min', 'seconds'].forEach(function (name) {

  document.forms['inputFields'].elements[name].setAttribute('disabled', true);

});