Javascript 在js/jquery中遍历表并创建一个数组

我希望遍历动态创建的表，并在每个索引处创建一个元素数组，包括项目名称、客户机名称和字段速率，以填充和传递JSON对象

以下是我的桌子的外观：

        <table id="project-table" class="table table-striped table-hover">
        <thead>
        <tr>
            <th>Project Name</th>
            <th>Client Name</th>
            <th>Field Rate</th>
            <th>Delete Row</th>
        </tr>
        </thead>
        <tbody>
        <%--jquery will append our data here...     --%>
        </tbody>
    </table>
    <button type="button" onclick="projectTable()" class="btn btn-primary">Add Row</button>

function projectTable() {

projectRows = projectRows + 1;

var $tbody = $('#project-table').find('tbody');
var $id = $("");
var $tr = $("<tr>");

$id.append(
    "<hidden id='projectId'/>" +
    "<hidden id='projectVersion'/>"
);

$tr.append(
    "<td>" + "<input class='form-control' id='inputProjectName' placeholder='Project Name' type='text'>" + "</td>" +
    "<td>" + "<input class='form-control' id='inputClientName' placeholder='Client Name' type='text'>" + "</td>" +
    "<td>" + "<input class='form-control' id='inputRate' placeholder='Rate' type='text'></td>" +
    "<td>" + "<input type='button' value='Delete' onclick='deleteRow(this)'>" + "</td>");
$tbody.append($id);
$tbody.append($tr);}

---

但是对于多个对象，我尝试了一些不同的for循环，但它们对我不起作用。

您可以通过选择所有

tr

，然后为每个对象选择

input

元素来构建数据

当前代码中的一些问题：

• 行中不能有静态

  id

  属性值，因为

  id

  值必须是唯一的
• 自定义

  hidden

  元素不能是

  tbody

  的子元素。我不知道你怎么需要这个元素

我修改了代码中的一些其他内容，使其更像jQuery：

函数项目表（）{
$（'#项目表>tbody'）。追加(
$（“”）。附加(
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“项目名称”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“客户端名称”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“速率”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件删除”）
.attr（{type:“button”}）.val（“Delete”））
)
);
}
$（文档）。在（“单击”、“.delete”上，函数（）{
$（this）.tr.remove（）；
});
$（'#get'）。单击（函数（）{
变量数据=$.map（$（'#项目表>tbody>tr'），函数（tr）{
变量$inp=$（'input'，tr）；
返回{
项目：$inp.eq（0.val（），
客户端：$inp.eq（1.val（），
速率：$inp.eq（2.val（），
};
});
$（'#jsonout'）.text（JSON.stringify（data，null，2））；
});

项目名称
客户名称
场速率
删除行
添加行
获取JSON
您可以选择所有的
tr
，然后为每个元素选择
输入
元素来构建数据

当前代码中的一些问题：


行中不能有静态
id
属性值，因为
id
值必须是唯一的
自定义
hidden
元素不能是
tbody
的子元素。我不知道你怎么需要这个元素

我修改了代码中的一些其他内容，使其更像jQuery：


函数项目表（）{
$（'#项目表>tbody'）。追加(
$（“”）。附加(
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“项目名称”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“客户端名称”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件”）
.attr（{占位符：“速率”，类型：“文本”}），
$（“”）.追加（$（“”）.添加类（“表单控件删除”）
.attr（{type:“button”}）.val（“Delete”））
)
);
}
$（文档）。在（“单击”、“.delete”上，函数（）{
$（this）.tr.remove（）；
});
$（'#get'）。单击（函数（）{
变量数据=$.map（$（'#项目表>tbody>tr'），函数（tr）{
变量$inp=$（'input'，tr）；
返回{
项目：$inp.eq（0.val（），
客户端：$inp.eq（1.val（），
速率：$inp.eq（2.val（），
};
});
$（'#jsonout'）.text（JSON.stringify（data，null，2））；
});

项目名称
客户名称
场速率
删除行
添加行
获取JSON
您尝试过什么？像
$（'#project table'）这样的简单循环。find（'tr'）。每个（…）
循环遍历所有行，您只需从
元素中提取所需的数据！？我遇到的问题是如何仅从前三个数据中提取数据，因为我不希望删除按钮成为提取的一部分。您尝试了什么？像
$（'#project table'）这样的简单循环。find（'tr'）。每个（…）
循环遍历所有行，您只需从
元素中提取所需的数据！？我遇到的问题是如何仅从前三个中提取数据，因为我不希望删除按钮成为提取的一部分。我需要Id和版本以更新对象。有没有更好的方法来处理这类事情？是的，您可以在
tr
元素上添加属性。我最终选择了另一条路线，但确实发现这是一个有用的起点。感谢您的帮助。我需要Id和版本以更新对象。有没有更好的方法来处理这类事情？是的，您可以在
tr
元素上添加属性。我最终选择了另一条路线，但确实发现这是一个有用的起点。谢谢你的帮助。
            projectList: [
            {
                id: projectId,
                version: projectVersion,
                projectName: projectName,
                clientName: clientName,
                fieldRate: fieldRate
            }