我如何通過jquery找到動態表的動態id？

Question

我面臨一些與創建動態表相關的問題。 我 append 行通過 jquery onchange 事件。 我的問題是我想查找表中每一行的行索引如何使用 jquery 獲取此 ID？

任何可以幫助我的機構？

這是我的代碼

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="assets/js/libs/jquery-3.5.1.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
</head>
<body>
    <button id="btn" onclick="addRow()">Add Row</button>
    <table id="Items_table" border="1">
        <thead>
            <tr>
                <th>Item Name</th>
                <th colspan="2">Quantity</th>
                <th>Purchase Price</th>
                <th>Tax%</th>
                <th>Tax Amount</th>
                <th>Discount</th>
                <th>Unit Cost</th>
                <th>Total Amount</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody id="Item_table_data">
        </tbody>
    </table>

    <script>
        var numberofRowsforItems = 0;
        function addRow() {
            numberofRowsforItems++;
            var htmlforItemTable = '<tr class="" id=" " data-row="1"><td class="tablerow"><span style="color:White">Hello</span></td ><td colspan="2"> <div><button id="table_q_btn">-</button> <input type="text"/><button id="table_q_btn">+</button> </div> </td >'
                + '<td><input type="text" value="Hellos" id="HelloID"/></td><td><input type="text" value="Hello" disabled/></td>'
                + '<td><input type="text" value="Hello"/></td><td><input type="text"/></td><td><span style="color:White">Hasd</span></td><td><span style="color:White">qdasd</span></td><td><button class="remove">-</button><button class="getId">Id</button></td></tr >';
            $('#Item_table_data').append(htmlforItemTable);
        }
        $(document).on('click', '.getId', function () {

            var a = $(this).closest('tr').find('.tablerow').val();
            alert(a);

            var b = $(this).val();
            alert(b);
        });
        $(document).on('click', '.remove', function () {
            $(this).parents('tr').remove();


        });
        
    </script>
</body>
</html>

我想 append 表中的這個動態行，現在我想通過 jquery 或 javascript 獲取每個行索引

Answer 1

下面是代碼的樣子：

var numberofRowsforItems = 0;
function addRow() {
    numberofRowsforItems++;
    var htmlforItemTable = '<tr class="" id="'+ numberofRowsforItems +'" data-row="1"><td class="tablerow"><span style="color:White">Hello</span></td ><td colspan="2"> <div><button id="table_q_btn">-</button> <input type="text"/><button id="table_q_btn">+</button> </div> </td >'
        + '<td><input type="text" value="Hellos" id="HelloID"/></td><td><input type="text" value="Hello" disabled/></td>'
        + '<td><input type="text" value="Hello"/></td><td><input type="text"/></td><td><span style="color:White">Hasd</span></td><td><span style="color:White">qdasd</span></td><td><button class="remove">-</button><button class="getId">Id</button></td></tr >';
    $('#Item_table_data').append(htmlforItemTable);
}
$(document).on('click', '.getId', function () {
    var a = $(this).closest('tr').attr('id');
    alert(a);
});

我改變的是： id="'+ numberofRowsforItems +'"和： $(this).closest('tr').attr('id');

我如何通過jquery找到動態表的動態id？

問題描述

1 個解決方案

解決方案1
0 已采納 2021-01-08 10:43:41

我如何通過jquery找到動態表的動態id？

問題描述

1 個解決方案

解決方案1 0 已采納 2021-01-08 10:43:41

解決方案1
0 已采納 2021-01-08 10:43:41