如何使用 Array.from 和 forEach 从多个表单字段值中获取值

Question

假设我有一个表格：

<form>
  <input type="text" class="blanked">
  <input type="text" class="blanked">
  <input type="text" class="blanked">
  <input type="submit" value="Press Me">
</form>

现在假设我使用 getElementsByClassName 创建这些元素的数组：

let filledBlanks = Array.from(document.getElementsByClassName( 'blanked' ));

现在我想遍历用户在每个输入中输入的值：

filledBlanks.forEach( filledBlank => {
  let inputText = filledBlank.???;
}

这是我被绊倒的地方。我用什么来获取填充值（不是.value）？或者有更好的方法来完成这个吗？

Answer 1

.value 属性工作得很好。我不明白你为什么需要别的东西。如果你只想迭代这些值，你可以先映射你的输入，但我不明白这一点。

请注意，我只使用 Jquery 来收听 submit 事件。剩下的就是纯香草 Javascript.

$('form').on('submit', (event) => {
  event.preventDefault();
  
  let filledBlanks = Array.from(document.getElementsByClassName( 'blanked' ));
  filledBlanks.map((input) => {
    return input.value;
  }).forEach((value) => {
    console.log(value);
  });
  
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="text" class="blanked">
  <input type="text" class="blanked">
  <input type="text" class="blanked">
  <input type="submit" value="Press Me" id="submit">
</form>

如何使用 Array.from 和 forEach 从多个表单字段值中获取值

How to get values from multiple form field values using Array.from and forEach

html

javascript

forms

foreach

getelementsbyclassname