Question

我正在使用jquery 2 我需要使用表中的值填充多维数组

这是我的代码（隐藏第一栏）

HTML：

<table  id="datatab"  border="1">
    <tbody>
        <tr role="row" class="odd">
            <td class="sorting_1" style="display: none;">2087971</td>
            <td>1</td>
            <td>1</td>
            <td>aaaa</td>
            <td>John Smith</td>
            <td><input type="text"  name="value1" value="1"></td>
            <td><input type="text"  name="value2" value="2"></td>
            <td><input type="text"  name="value3" value="3"></td>
            <td></td>
         </tr>
        <tr role="row" class="even">
            <td class="sorting_1" style="display: none;">2087972</td>
            <td>2</td>
            <td>2</td>
            <td>bbbb</td>
            <td>Peter Parker</td>
            <td><input type="text"  name="value1" value="4"></td>
            <td><input type="text"  name="value2" value="4"></td>
            <td><input type="text"  name="value3" value="4"></td>
            <td></td>
        </tr>
    </tbody>
</table>
<button id="GetData">Get data</button>

jquery的：

<script type="text/javascript">

    $("#GetData").click(function (event) {
        debugger;
        event.preventDefault();
        var TableData = new Array();
        $('#datatab tbody tr').each(function (row, tr) {
            TableData[row] = {
                "id": $(tr).find('td:eq(0)').text()
                , "value1": $(tr).find('td:eq(5)').find("input").value
                , "value2": $(tr).find('td:eq(6)').find("input").value
                , "value3": $(tr).find('td:eq(7)').find("input").value
            }
        });


    });
</script>

我使用行

在我的数组中成功填充了第一个id列

$(tr).find('td:eq(0)').text()

但输入值为undefined

我做错了什么？

Answer 1

您需要使用jQuery对象的val()方法，因为它们没有value属性，就像底层的DOMElements一样。另请注意，您可以使用map()来构建阵列。试试这个：

$("#GetData").click(function(e) {
    e.preventDefault();
    var tableData = $('#datatab tbody tr').map(function(row, tr) {
        var $row = $(tr);
        return {
            id: $row.find('td:eq(0)').text(),
            value1: $row.find('td:eq(5) input').val(), 
            value2: $row.find('td:eq(6) input').val(),
            value3: $row.find('td:eq(7) input').val()
        }
    }).get();

    // work with tableData here...
});

Working example

表单元格输入返回未定义

1 个答案: