1、刪除多行javascript
HTMLhtml
<table id = "test_table"> <tr><td><input type="checkbox" name="test"></td><td>11</td><td>2111</td><td>3111</td></tr> <tr><td><input type="checkbox" name="test"></td><td>4</td><td>5</td><td>6</td></tr> <tr><td><input type="checkbox" name="test"></td><td>7</td><td>8</td><td>9</td></tr> <tr><td><input type="checkbox" name="test"></td><td>101</td><td>111</td><td>121</td></tr> </table> <input type="button" value="delete">
Jquery 代碼 java
$(function(){ $("input[type='button']").click(function() { $("input[name='test']:checked").each(function() { // 遍歷選中的checkbox n = $(this).parents("tr").index(); // 獲取checkbox所在行的順序 $("table#test_table").find("tr:eq("+n+")").remove(); }); }); });
2、刪除多列this
HTML code
<table id="test_table"> <tr> <td><input type="checkbox" name="test">第1列</td> <td><input type="checkbox" name="test">第2列</td> <td><input type="checkbox" name="test">第3列</td> <td><input type="checkbox" name="test">第4列</td> <td><input type="checkbox" name="test">第5列</td> </tr> <tr><td>1-1</td><td>1-2</td><td>1-3</td><td>1-4</td><td>1-5</td></tr> <tr><td>2-1</td><td>2-2</td><td>2-3</td><td>2-4</td><td>2-5</td></tr> <tr><td>3-1</td><td>3-2</td><td>3-3</td><td>3-4</td><td>3-5</td></tr> </table> <input type='button' value='delete'/>
Jquery 代碼htm
$(function(){ $("input[type='button']").click(function() { $("input[name='test']:checked").each(function() { // 遍歷選中的checkbox n = $(this).parent("td").index(); // 獲取checkbox所在列順序 $("table#test_table tr").find("td:eq("+n+")").remove(); }); }); });