javascript - 如何获取输入字段值数组并通过 Ajax 调用传递它

Question

我有一个 Web 表单，现在看起来像这样。问题是我有一个选项可以在它们下面添加更多动态行，这些行看起来相同并且具有相同的名称属性。我有一个提交按钮，它获取所有输入字段的值。提交的值通过对我的 PHP 的 Ajax 调用，我必须将它们插入到我的数据库中。

Access:
<tr>
  <td><input type"text" name="access[name]"></td>
  <td><input type"text" name="access[type]"></td>
  <td><input type"text" name="access[description]"></td>
</tr>

student:
<tr>
  <td><input type"text" name="student[name]"></td>
  <td><input type"text" name="student[type]"></td>
  <td><input type"text" name="student[description]"></td>
</tr>

到目前为止，我无法获取数组中输入字段生成的所有值，以便我可以正确排序并将它们插入到我的数据库中。

我一直在寻找我的数组结构，使其看起来像这样或像一个正确的 JSON 格式。但我不知道如何在 Ajax 调用中执行此操作。

access[
         name:xyz,
         type:xyz,
         description
      ]
student[
         name:xyz,
         type:xyz,
         description
      ]

我的 Ajax 函数:

    $('.submit').on('click',function(){

    var access;
    $('input[name^="Access"]').each(function() {
        access= ($(this).val());
    });
    var student;
    $('input[name^="student"]').each(function() {
        student= ($(this).val());
    });

    $.ajax({
           url: '../php/Submission.php',
           type: 'post',
           data: {access:access,student:student}
       },
           function(data1)
            {
                console.log(data1);
            }
      );
}); 

我知道我的 Ajax 函数没有写，但我已经尝试了很多代码来让它工作，结果它全乱了，不知道现在该怎么做。

Answer 1

将您的access 和student 变量变为数组，并将值添加到它们(注意:您可以简单地使用this.value而不是 $(this).val():

var access = [];
$('input[name^="Access"]').each(function() {
    access.push(this.value);
});
var student = [];
$('input[name^="student"]').each(function() {
    student.push(this.value);
});

编辑 如果您想命名您的值而不是使用索引，您将需要使用对象而不是数组，并手动提取名称:

var access = {};
$('input[name^="access"]').each(function() {
    var name = this.name.substr(7, this.name.length - 8);
    access[name] = this.value;
});
var student = {};
$('input[name^="student"]').each(function() {
    var name = this.name.substr(8, this.name.length - 9);
    student[name] = this.value;
});