Question

我有一个html表，其中的行从循环中填充，我想从打印按钮上的click事件中的所有行中删除最后两列：

JS：

$("#print").on('click', function(){  
     //I want to remove columns HERE
})

我该怎么做？

Answer 1

我不确定您是否真的在寻找（删除列或列内容），但您可以尝试以下建议。

删除最后两个列：

您只需调用以下代码，删除最后一个子项的次数与要删除的列数相同：

$("table").find("th:last-child, td:last-child").remove();

$("#print").on('click', function(){  
    var remove_cols_number =2;
    
    for(var i=0;i<remove_cols_number;i++){
    	$("table").find("th:last-child, td:last-child").remove();
    }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="width:100%" border='1'>
  <tr>
    <th>Column 1</th>
    <th>Column 2</th> 
    <th>Column 3</th>
    <th>Column 4</th>
    <th>Column 5</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td> 
    <td>50</td> 
    <td>Bill</td>
    <td>2</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>94</td>
    <td>Gates</td>
    <td>1</td>
  </tr>
</table>
<br>
<button id='print' type="button">Print</button>

删除最后两列内容：

您可以获取列长度并删除一个，因为eq()使用基于零的索引，然后使用empty()删除最后一个的内容和列前一个-1的列：

var columns_length = $("table th").length-1;

$("table tr").find("td:eq("+columns_length+"), td:eq("+(columns_length-1)+")").empty();

$("#print").on('click', function(){  
    var columns_length = $("table th").length-1;

    $("table tr").find("td:eq("+columns_length+"), td:eq("+(columns_length-1)+")").empty();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table style="width:100%" border='1'>
  <tr>
    <th>Column 1</th>
    <th>Column 2</th> 
    <th>Column 3</th>
    <th>Column 4</th>
    <th>Column 5</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td> 
    <td>50</td> 
    <td>Bill</td>
    <td>2</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>94</td>
    <td>Gates</td>
    <td>1</td>
  </tr>
</table>
<br>
<button id='print' type="button">Print</button>

使用循环删除html表中的列内容

1 个答案: