jquery实现表格的多行删除

来源:互联网 发布:安卓直播app源码 编辑:程序博客网 时间:2024/06/11 08:28

初学jquery,发现自己比较脑残的一味百度,找到一些代码,就想着运行,出现问题不知道怎么解决。

下面介绍如何运用jquery实现表格的多行删除

首先如果你没有jquery类库,要先下载jquery类库,否则你的代码会运行不会出现你想要的结果。下载之后要引用。代码如下,随后还有jquery的类库压缩包,有需要的可以下载。

<!DOCTYPE html><html><head><meta charset="utf-8"><title>表格的删除</title><script src="jquery/jquery-1.8.3.min.js"></script> //这里引入jquery的js文件,需要下载类库,下载相应的版本就可以正常应用了。<script type="text/javascript">$(function(){      $("input[type='button']").click(function() {    //alert("sf");        $("input[name='test']:checked").each(function() { // 遍历选中的checkbox            n = $(this).parents("tr").index();  // 获取checkbox所在行的顺序            $("table#test_table").find("tr:eq("+n+")").remove();        });    });});</script></head><body><table id = "test_table" border="1px">    <tr><td><input type="checkbox" name="test"></td><td>1</td><td>2</td><td>3</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>10</td><td>11</td><td>12</td></tr></table><input type="button" value="删除"></body>


0 0