根据复选框切换数据表行

时间：2018-12-14 11:01:15

标签： javascript jquery datatable datatables

这是我的HTML。

<table class="table table-striped table-bordered table-hover dataTable no-footer" id="datatable_ajax" style=" padding: 15px;" role="grid" aria-describedby="datatable_ajax_info">
    <thead>
        <tr role="row">
            <th class="sorting_asc" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-sort="ascending" aria-label="Date: activate to sort column descending">Date</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Time">Time</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="Transaction ID: activate to sort column ascending">Transaction ID</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Step">Step</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Step Type">Step Type</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="User ID: activate to sort column ascending">User ID</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="User: activate to sort column ascending">User</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="Type: activate to sort column ascending">Type</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Side">Side</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="Coin: activate to sort column ascending">Coin</th>
            <th class="sorting" tabindex="0" aria-controls="datatable_ajax" rowspan="1" colspan="1" aria-label="Wallet: activate to sort column ascending">Wallet</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Price">Price</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Quantity">Quantity</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Fee">Fee</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Fee USD">Fee USD</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Vendor Value">Vendor Value</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Vendor Fee">Vendor Fee</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Vendor Fee %">Vendor Fee %</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Vendor Fee USD">Vendor Fee USD</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Fee Castle X">Fee Castle X</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Fee Castle X %">Fee Castle X %</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Fee Castle X USD">Fee Castle X USD</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Net Qty">Net Qty</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Value USD">Value USD</th>
            <th class="sorting_disabled" rowspan="1" colspan="1" aria-label="Net Value USD">Net Value USD</th>
        </tr>
        <tr role="row" class="filter">
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm datetimepicker" name="time_from" placeholder="Starting Time">
                <input type="text" class="form-control form-filter input-sm datetimepicker" name="time_to" placeholder="Ending Time">
            </td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="id">
            </td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="user_id">
            </td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="name">
            </td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="type">
            </td>
            <td rowspan="1" colspan="1">
            </td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="coin">
            </td>
            <td rowspan="1" colspan="1">
                <input type="text" class="form-control form-filter input-sm" name="wallet">
            </td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
            <td rowspan="1" colspan="1"></td>
        </tr>
    </thead>
    <tbody>
        <tr role="row" class="odd">
            <td class="sorting_1">12-12-2018</td>
            <td>09:23:56</td>
            <td>100000100</td>
            <td></td>
            <td></td>
            <td>100001</td>
            <td>Najam Masood</td>
            <td>MANUAL_DEPOSIT</td>
            <td></td>
            <td></td>
            <td>USD</td>
            <td>1.00000000</td>
            <td>25.00000000</td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.00000000</td>
            <td>4.00</td>
            <td>1.00</td>
            <td>24.00000000</td>
            <td>25.00</td>
            <td>24.00</td>
        </tr>
        <tr role="row" class="even">
            <td class="sorting_1">12-12-2018</td>
            <td>09:53:43</td>
            <td>100000101</td>
            <td>1</td>
            <td></td>
            <td>100001</td>
            <td>Najam Masood</td>
            <td>MARKET</td>
            <td>BUY</td>
            <td>ADA</td>
            <td>USDT</td>
            <td>0.02991</td>
            <td>534.8</td>
            <td></td>
            <td></td>
            <td>3.25097967</td>
            <td>0.00243789</td>
            <td>0.074989</td>
            <td>0.01198198</td>
            <td>2.67400000 ADA</td>
            <td>0.5</td>
            <td>0.07997934</td>
            <td>532.126</td>
            <td>15.995868</td>
            <td>15.91588866</td>
        </tr>
        <tr role="row" class="odd">
            <td class="sorting_1">12-12-2018</td>
            <td>09:54:47</td>
            <td>100000102</td>
            <td>1</td>
            <td></td>
            <td>100001</td>
            <td>Najam Masood</td>
            <td>MARKET</td>
            <td>SELL</td>
            <td>ADA</td>
            <td>USDT</td>
            <td>0.02989</td>
            <td>532.1</td>
            <td></td>
            <td></td>
            <td>3.23878225</td>
            <td>0.00243238</td>
            <td>0.075101</td>
            <td>0.01195174</td>
            <td>0.07952234 USDT</td>
            <td>0.5</td>
            <td>0.07952234</td>
            <td>532.1</td>
            <td>15.904469</td>
            <td>15.82494666</td>
        </tr>
        <tr role="row" class="even">
            <td class="sorting_1">12-12-2018</td>
            <td>09:55:47</td>
            <td>100000103</td>
            <td>1</td>
            <td></td>
            <td>100001</td>
            <td>Najam Masood</td>
            <td>MARKET</td>
            <td>BUY</td>
            <td>BTC</td>
            <td>USDT</td>
            <td>3405.15</td>
            <td>0.0047</td>
            <td></td>
            <td></td>
            <td>3.24967157</td>
            <td>0.00243725</td>
            <td>0.074999</td>
            <td>0.01199151</td>
            <td>0.00002350 BTC</td>
            <td>0.5</td>
            <td>0.08002102</td>
            <td>0.0046765</td>
            <td>16.004205</td>
            <td>15.92418398</td>
        </tr>
        <tr role="row" class="odd">
            <td class="sorting_1">12-12-2018</td>
            <td>09:56:57</td>
            <td>100000104</td>
            <td>1</td>
            <td></td>
            <td>100001</td>
            <td>Najam Masood</td>
            <td>MARKET</td>
            <td>SELL</td>
            <td>BTC</td>
            <td>USDT</td>
            <td>3404.19</td>
            <td>0.004676</td>
            <td></td>
            <td></td>
            <td>3.23718402</td>
            <td>0.00242676</td>
            <td>0.074965</td>
            <td>0.01190811</td>
            <td>0.07958996 USDT</td>
            <td>0.5</td>
            <td>0.07958996</td>
            <td>0.004676</td>
            <td>15.91799244</td>
            <td>15.83840248</td>
        </tr>
        <tr role="row" class="even">
            <td class="sorting_1">12-12-2018</td>
            <td>10:32:05</td>
            <td>100000105</td>
            <td></td>
            <td></td>
            <td>100013</td>
            <td>Salim Shah</td>
            <td>DEPOSIT</td>
            <td></td>
            <td></td>
            <td>GBP</td>
            <td>1.27529060</td>
            <td>39.21</td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.34</td>
            <td></td>
            <td>1.7088894</td>
            <td>1.9605</td>
            <td>5.00</td>
            <td>2.50</td>
            <td>37.24950000</td>
            <td>50.00</td>
            <td>47.50</td>
        </tr>
        <tr role="row" class="odd">
            <td class="sorting_1">12-12-2018</td>
            <td>10:32:18</td>
            <td>100000106</td>
            <td></td>
            <td></td>
            <td>100013</td>
            <td>Salim Shah</td>
            <td>DEPOSIT</td>
            <td></td>
            <td></td>
            <td>GBP</td>
            <td>1.27529060</td>
            <td>45.48</td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.52</td>
            <td></td>
            <td>1.93844171</td>
            <td>2.274</td>
            <td>5.00</td>
            <td>2.90</td>
            <td>43.20600000</td>
            <td>58.00</td>
            <td>55.10</td>
        </tr>
        <tr role="row" class="even">
            <td class="sorting_1">12-12-2018</td>
            <td>10:32:35</td>
            <td>100000107</td>
            <td></td>
            <td></td>
            <td>100013</td>
            <td>Salim Shah</td>
            <td>DEPOSIT</td>
            <td></td>
            <td></td>
            <td>GBP</td>
            <td>1.27529060</td>
            <td>31.37</td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.11</td>
            <td></td>
            <td>1.41557256</td>
            <td>1.5685</td>
            <td>5.00</td>
            <td>2.00</td>
            <td>29.80150000</td>
            <td>40.00</td>
            <td>38.00</td>
        </tr>
        <tr role="row" class="odd">
            <td class="sorting_1">12-12-2018</td>
            <td>10:36:16</td>
            <td>100000108</td>
            <td></td>
            <td></td>
            <td>100013</td>
            <td>Salim Shah</td>
            <td>DEPOSIT</td>
            <td></td>
            <td></td>
            <td>GBP</td>
            <td>1.27529060</td>
            <td>39.21</td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.34</td>
            <td></td>
            <td>1.7088894</td>
            <td>1.9605</td>
            <td>5.00</td>
            <td>2.50</td>
            <td>37.24950000</td>
            <td>50.00</td>
            <td>47.50</td>
        </tr>
        <tr role="row" class="even">
            <td class="sorting_1">12-12-2018</td>
            <td>10:36:30</td>
            <td>100000109</td>
            <td></td>
            <td></td>
            <td>100013</td>
            <td>Salim Shah</td>
            <td>DEPOSIT</td>
            <td></td>
            <td></td>
            <td>GBP</td>
            <td>1.27529060</td>
            <td>31.37</td>
            <td></td>
            <td></td>
            <td></td>
            <td>1.11</td>
            <td></td>
            <td>1.41557256</td>
            <td>1.5685</td>
            <td>5.00</td>
            <td>2.00</td>
            <td>29.80150000</td>
            <td>40.00</td>
            <td>38.00</td>
        </tr>
    </tbody>
</table>

我有一个复选框，我想根据第4列Step切换行。基本上，我想要的是，如果该列的“复选框”被打勾，它应该显示具有Step的innerHTML的那些行，如果未选中，我们将隐藏那些innerHTML为1或2的行。

我无法遍历所有tr和td。我们将忽略第一行，因为它没有数据。到目前为止，我已经尝试过了

$('#datatable_ajax tr td:nth-child(4)').each(function(){
    $(this).find('td').each(function(){
        console.log($(this));
    })
})

但是我似乎无法从中提取innerHTML。有帮助吗？

1 个答案:

答案 0 :(得分：0)

假设您要获取表的每个记录中第4列的值

var i = 0;
$('#datatable_ajax tr').each(function(){
    if(i != 0)
    {
        console.log($(this).find('td:eq(3)').html());
    }
    i++;
})

假设您要获取表的每个记录中每一列的值

var i = 0;
$('#datatable_ajax tr').each(function(){
    if(i != 0)
    {
        $(this).find('td').each(function(){
            console.log($(this).html());
        });
    }
    i++;
})

注意：

  1. 这里i！= 0用来跳过第一个tr（包含标题）
  2. jquery中的索引将从“ 0”开始，因此，如果您想要第4个td，则需要使用索引3
相关问题
最新问题