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



假设我有一个表单:

<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(?或者有更好的方法来实现这一点吗?

.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>

最新更新