jQuery如何删除两者 <tr> 点击标签？

Question

I have a checkbox which has id - when I select the checkbox -es and click the button , the tr tag should get removed; 我有一个带有id的checkbox -当我选择checkbox -es并单击button ，应该删除tr标签； when I select the multiple checkbox -es both tr tag should get removed, but the thing is when I select the multiple checkbox -es only the tr tag belong to the 1st id get removed. 当我选择多个checkbox -es时，两个tr标签都应被删除，但是问题是当我选择多个checkbox -es时，仅属于第一个id的tr标签被删除。

I have tried the following code 我尝试了以下代码

jQuery jQuery的

<script>
    function getsample(val) {
        $(function () {
            checkboxid = $('input[name="chk"]:checked').map(function () {
                return this.id
            }).get();
        });
        $("#" + checkboxid).closest('tr').remove();
    }
</script>

HTML 的HTML

<html>
<body>
    <table>
        <tbody>
        <thead>
            <tr>
                <th>UserName</th>
                <th>Role</th>
                <th>Department</th>
                <th>Semester</th>
                <th>Email</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>student15</td>
                <td>Student</td>
                <td>CS</td>
                <td>2</td>
                <td>arung@gmail.com</td>
                <td><input name="chk" type="checkbox" id="sam1"></td>
            </tr>
            <tr>
                <td>student16</td>
                <td>Student</td>
                <td>CS</td>
                <td>2</td>
                <td>arung@gmail.com</td>
                <td><input name="chk" type="checkbox" id="sam2"></td>
            </tr>
        </tbody>
    </table>
    <input type="button" onclick="getsample()" id="button" value="Submit">
</body>
</html>

When I use $("#"+this.id).closest('tr').remove(); 当我使用$("#"+this.id).closest('tr').remove(); inside the map function all the selected tr tag get removed, but I need to call checkbox id outside the map function. 在地图功能内，所有选定的tr标签都将被删除，但我需要在地图功能外调用checkbox id 。

Help me, thanks in advance. 帮帮我，谢谢。

Answer 1

You can directly loop through the checked check boxes, and remove the parent tr using $(this).closest("tr") 您可以直接循环选中的复选框，并使用$(this).closest("tr")删除父tr。

$("#button").click(function() {
  $("[name='chk']:checked").each(function() {
    $(this).closest("tr").remove();
  });
});

Fiddle 小提琴

Answer 2

Change your getsample() function to following. 将您的getsample()函数更改为以下内容。

 function getsample(val) { $('input[name="chk"]:checked').closest('tr').remove(); }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <thead> <tr> <th>UserName</th> <th>Role</th> <th>Department</th> <th>Semester</th> <th>Email</th> <th>Action</th> </tr> </thead> <tbody> <tr> <td>student15</td> <td>Student</td> <td>CS</td> <td>2</td> <td>arung@gmail.com</td> <td><input name="chk" type="checkbox" id="sam1"></td> </tr> <tr> <td>student16</td> <td>Student</td> <td>CS</td> <td>2</td> <td>arung@gmail.com</td> <td><input name="chk" type="checkbox" id="sam2"></td> </tr> </tbody> </table> <input type="button" onclick="getsample()" id="button" value="Submit">

Answer 3

You can remove all <tr> tags by using jquery to select all the input fields starting with the id "sam" (or name equal to or starting with "chk") which are checked. 您可以通过使用jquery选择选中所有以id“ sam”（或名称等于或以“ chk”开头）的所有输入字段来删除所有<tr>标记。 This can be done with $('[id^="sam"]:checked') where 'id^' stands for "id starting with". 这可以通过$('[id^="sam"]:checked') ，其中'id ^'代表“以...开头的id”。 You can also remove the '^' for exact match or put 'name' instead of id. 您也可以删除“ ^”以进行完全匹配，也可以输入“名称”代替id。

Are working plunker can be found here . 正在工作的unk子可以在这里找到。

jQuery如何删除两者 <tr> 点击标签？

问题描述

3 个解决方案

解决方案1
2 2016-04-18 09:45:24

解决方案2
2 已采纳 2016-04-18 09:47:18

解决方案3
0 2016-04-18 09:56:56

jQuery如何删除两者 <tr> 点击标签？

问题描述

3 个解决方案

解决方案1 2 2016-04-18 09:45:24

解决方案2 2 已采纳 2016-04-18 09:47:18

解决方案3 0 2016-04-18 09:56:56

解决方案1
2 2016-04-18 09:45:24

解决方案2
2 已采纳 2016-04-18 09:47:18

解决方案3
0 2016-04-18 09:56:56