javascript - 如何使用类名更改多个文本输入的值

Question

我希望能够按类更改多个文本输入(但不是全部)，但似乎无法正常工作。

有什么想法吗？

基本上我在同一个页面上有多个重置按钮，我想将目标文本输入的值“重置”为空。

代码如下:

$(".reset").on('click', function() {
  document.getElementsByClassName('input-1').value = '';
});

使用 getElementById 时效果很好，但我宁愿尽量减少代码，也不必每次都为每个文本输入重复它。

Answer 1

您已经在使用 jQuery，所以只需使用

$(".reset").on('click', function() {
  $('.input-1').val('');
});

注意类名前的 .，与 .reset 相同。

如果你想使用 vanilla JavaScript，你必须遍历 getElementsByClassName 返回的 HTMLCollection:

$(".reset").on('click', function() {
  Array.from(document.getElementsByClassName('input-1')).forEach(el => el.value = '');
});

jQuery 会自动为您完成。