Question

我有以下表格的HTML代码：

    <table id="blacklistgrid_1"  class="table table-bordered table-hover table-striped">
                          <thead>
                            <tr>
                              <th style="vertical-align:middle">Products</th>
                              <th style="vertical-align:middle">Pack Of</th>
                              <th style="vertical-align:middle">Quantity</th>
                              <th style="vertical-align:middle">Volume</th>
                              <th style="vertical-align:middle">Unit</th>
                              <th style="vertical-align:middle">Rebate Amount</th>
                            </tr>
                          </thead>
                          <tbody class="apnd-test">
    <tr id="reb1_1">
    <td><input type="text" name="pack[1]" id="pack_1" value="" class="form-control" size="8"/></td>
                              <td><input type="text" name="quantity[1]" id="quantity_1" value="" class="form-control" size="8"/></td>
                              <td><input type="text" name="volume[1]" id="volume_1" value="" class="form-control" size="8"/></td>
    </tr>
                          </tbody>
<tfoot>
                        <tr id="reb1_2">
                          <td><button style="float:right; margin-bottom: 20px" class="products" type="button" class="btn btn-default" onclick="">&nbsp;Add</button></td>


<td></td>
                      <td></td>
                      <td></td>
                      <td></td>
                      <td></td>
                    </tr>
                  </tfoot>
</table>

我在上面的表格中跟随jQuery代码：

    $(document).ready(function() {
    $('.products').click(function () {
        var new_row = $('#reb1').clone();
        /*Here I want to use the id as #blacklistgrid_1. As the there may be more than one tables present the ids could be #blacklistgrid_2, #blacklistgrid_3, and so on. So it should be dynamic not static for value 1*/
        var tbody = $('tbody', '#blacklistgrid');

/*And in this line too, I want to access the tr and t body of that table with specific id only*/
        var n = $('tr', tbody).length  + 1;
        new_row.attr('id', 'reb' + n);
        $(':input', new_row).not('.prod_list').remove();
        //new_row.find("td:eq(1)").html();
        $('<button style="color:#C00; opacity: 2;" type="button" class="close delete" data-dismiss="alert" aria-hidden="true">&times;</button>').appendTo( $(new_row.find('td:first')) );
        tbody.append(new_row);
        $('.delete').on('click', deleteRow);
       });
    });

我已经在上面的代码中以评论的形式写了我的要求。所以有人请帮助我实现这一目标。谢谢。

Answer 1

您可以创建代码， id 以 blacklistgrid

开头

$('[id^= blacklistgrid_]') // here you can access all elements whose id starts 
                          // with backlistgrid_

并访问他们的特定孩子

$('[id^= blacklistgrid_]>td')

其他人试图在评论中解释，

此处使用class选择器，您将访问其ID

$.each('.table', function () {  // iterate all the table elements
    var id = $(this).prop('id');
    if (id === "blacklistgrid_1") {  // check for the ids
        //Perform ToDos
        var tds = $(this).find('td');
        // using tds perform its ToDos
    }
});

如何在jQuery中访问HTML元素的Id的一部分？

1 个答案: