Question

我有一个表，我想要同时选择一行并删除一行，但我无法想象如何使用JQuery执行此操作。代码我只影响表中的第一行。所以我可以删除第一行而不是其他行。怎么了。这是我试过的：

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("#newCandidatesTable").tablesorter();
        var candidateID = $("#candidateID").text();

        // Event actions
        $("#acceptCandidateButton_" + candidateID).click(function(e) {
            $.post("/Admin/AcceptCandidate/", { candidateID: $("#candidateID").text() }, completeAccept());
        });

        // Functions
        function completeAccept() {
            showMsgBox($("#candidateName").text() + " er blevet accepteret, som ansøger til stillingen: ...");
            $("#tr_" + candidateID).remove();
        }

        function getFirstNameFromFullName(fullName) {
            var nameArray = new Array();

            nameArray = fullName.toString().split(" ");

            return nameArray[0];
        }
    });
</script>
<h2>Nye ansøgere</h2>
<table id="newCandidatesTable">
    <thead>
        <tr>
            <th style="cursor: pointer;">ID</th>
            <th style="cursor: pointer;">Navn</th>
            <th style="cursor: pointer;">Email</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
<% foreach (var candidate in Model)
{
     %>
        <tr id="<%= "tr_" + candidate.iAnsogerID %>">
            <td><div id="candidateID"><%= candidate.iAnsogerID %></div></td>
            <td><div id="candidateName"><%= candidate.vNavn %></div></td>
            <td><div id="candidateEmail"><%= candidate.vEmail %></div></td>
            <td>
                <div id="<%= "acceptCandidateButton_" + candidate.iAnsogerID %>" style="cursor: pointer; border: 1px solid black; width: 150px; text-align: center;">Godkend</div>
            </td>
        </tr>
     <%
} %>
</tbody>
</table>

Answer 1

我认为您需要将事件连接包装在foreach中，以迭代您拥有的项目集合。

$("#candidateID").each(function() {
  // Event actions
  var candID = this.text;
  $("#acceptCandidateButton_" + candID).click(function() {
    $.post("/Admin/AcceptCandidate/", { candidateID: candID }, completeAccept());
  });
});

我没有机会测试这个，但如果没有别的东西，它应该让你走上正轨。

我猜你也可以在你的页面生成循环中直接这样做，即：

<td>
  <div id="<%= "acceptCandidateButton_" + candidate.iAnsogerID %>" style="cursor: pointer; border: 1px solid black; width: 150px; text-align: center;" onclick="$.post("/Admin/AcceptCandidate/", { candidateID: " + candidate.iAnsogerID + " }, completeAccept())">Godkend</div>
</td>

Answer 2

您正在创建<div id="candidateID">（以及其他两个div）在循环中，因此您正在重复使用id =“candidateID “你拥有的每个候选人的属性，这肯定会破坏事情。在这种情况下，jQuery（当然还有底层浏览器）选择只识别第一个这样的字段，因此你只能删除第一行。

执行实际删除的代码行是正确的：

$("#tr_" + candidateID).remove();

您只需要确保将candidateID设置为有意义的内容。没有更多的背景，我不确定那会是什么。

Answer 3

您实际上不需要在选择器中插入任何内容来删除TR，例如，这将起作用：

    $("#acceptCandidateButton_" + candidateID).click(function(e) {
        $.post("/Admin/AcceptCandidate/", { candidateID: $("#candidateID").text() }, completeAccept($(this));
    });

    // Functions
    function completeAccept(context) {
        showMsgBox($("#candidateName").text() + " er blevet accepteret, som ansøger til stillingen: ...");
        context.parent().parent().remove();
    }

Jquery：在表中选择一行并使用其数据？

3 个答案: