使用jQuery仅导出选中的复选框

时间:2018-07-05 03:37:54

标签: javascript jquery html

我具有导出和仅打印表格的功能。

像这样的代码段

r  = 'myTable';
r = $("#" + r).clone();
$(".result").append(r);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="myTable" border="1">
    <tr>
      <td><input type="checkbox"></td>  
      <td>A</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td> 
      <td>B</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td> 
      <td>C</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td> 
      <td>D</td>
    </tr>
  
</table>

<h1>export result</h1>

<div class="result">
  
</div>

如何克隆表以仅导出选中的复选框?

1 个答案:

答案 0 :(得分:0)

可以从克隆中删除(或隐藏)未经检查的行,例如

r  = 'myTable';
r = $("#" + r).clone();
r.find(':checkbox:not(:checked)').closest('tr').remove();// or hide()
$(".result").append(r);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="display:none">
<table id="myTable" border="1">
    <tr>
      <td><input type="checkbox" checked></td>  
      <td>A</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td> 
      <td>B</td>
    </tr>
    <tr>
      <td><input type="checkbox" checked></td> 
      <td>C</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td> 
      <td>D</td>
    </tr>
  
</table>
</div>
<h1>export result</h1>

<div class="result">
  
</div>