HTML输入数组：如何使用javascript获取html输入数组值

Question

我有此代码，可以正常工作！：

 <script> function get(userfirstname, userlastname){ alert(userfirstname); return false; } </script> <form action="" method="POST"> <input type="text" name="userfirstname"> <input type="text" name="userlastname"> <input type="submit" onclick="return get(userfirstname.value, userlastname.value);"> </form> 

我试图用这样的数组捕获输入值：

 <script> function get(user){ alert(user["firstname"].value); return false; } </script> <form action="" method="POST"> <input type="text" name="user[firstname]"> <input type="text" name="user[lastname]"> <input type="submit" onclick="return get(user);"> </form> 

我尝试了很多不同的情况，没有意义:(

任何提示将不胜感激。

Answer 1

您可以简单地将onclick处理程序内的form元素作为目标，查询所有input元素以遍历它们，并构建所需的array 。

这是一个示例，说明如何构建包含每个输入元素名称和值的对象数组，但不包括禁用一次和提交元素。

 function get(evt){ var fields = []; event.target.parentElement .querySelectorAll('input:not([disabled]):not([type="submit"])').forEach(function(e) { fields.push({name: e.name, value: e.value}); }) console.log(fields); return false; } 

 <form> <input type="text" name="firstname" placeholder="Name"><br> <input type="text" name="lastname" placeholder="Surename"><br> <input type="text" name="foo" value="foo will be excluded" disabled><br> <input type="submit" onclick="return get();"> </form> 

Answer 2

一个jQuery的方法来做到这一点

function get(){
    var fields = [];
    var arr = $('form').not('input[type="submit"]').find('input[type="text"]')
    $(arr).each(function(i,val){
        fields.push({name:$(val).attr('name'),value:$(val).val()})
    })
}