jquery删除表行

我有一张桌子

<table id="favoriteFoodTable">
    <th>
        Food Name:
    </th>
    <th>
        Restaurant Name:
    </th>
    <th>

    </th>
    <?php while ($row = $foods->fetch()) {
        ?>
        <tr>
            <td>
                <?php echo $row['foodName']; ?>
            </td>
            <td>
                <?php echo $row['restaurantName']; ?>
            </td>
            <td>
                <a class="deleteLink" href="" >delete</a>
            </td>
        </tr>
    <?php } ?>
</table>

---

只是背景在改变，但行没有被删除，为什么？如何解决？

该行已被删除，但由于单击会使您跟随链接，因此在刷新页面时会立即恢复该行

添加

返回false或在回调结束时，以防止出现默认行为：

$(document).ready(function() {
    $("#favoriteFoodTable .deleteLink").on("click",function() {
        var tr = $(this).closest('tr');
        tr.css("background-color","#FF3700");
        tr.fadeOut(400, function(){
            tr.remove();
        });
        return false;
    });
});


请注意，我使用了
closest
来获得更可靠的代码：如果中间有另一个元素，则仍然会找到
tr
。
您忘记了在链接中设置哈希。
例如：

<a class="deleteLink" href="" >delete</a>

在你生命的尽头

$(document).ready(function() {
    $("#favoriteFoodTable .deleteLink").on("click",function() {
        ...
        return false;
    });
});

这是另一个选择

function DeleteRowOfProductTable(productID){
    $('#YourTableId tr').each(function (i, row) {
        var $row = $(row);
        var productLabelId =  $row.find('label[name*="Product_' + productID + '"]');

       var $productLabelIdValue = $productLabelId.text();
       if (parseInt(productID) == parseInt($productLabelIdValue))
       {
           $row.remove(); 
       }
    });
 }

如果希望一次只选择表中的一行

$("#data tr").click(function() {
    var selected = $(this).hasClass("highlight");
    $("#data tr").removeClass("highlight");
    if(!selected)
            $(this).addClass("highlight");

试一试

为我工作
 你什么意思？单击“删除”：行淡出，然后被删除。请在回答中添加更多说明
$(document).ready(function() {
    $("#favoriteFoodTable .deleteLink").on("click",function() {
        ...
        return false;
    });
});

function DeleteRowOfProductTable(productID){
    $('#YourTableId tr').each(function (i, row) {
        var $row = $(row);
        var productLabelId =  $row.find('label[name*="Product_' + productID + '"]');

       var $productLabelIdValue = $productLabelId.text();
       if (parseInt(productID) == parseInt($productLabelIdValue))
       {
           $row.remove(); 
       }
    });
 }

$("#data tr").click(function() {
    var selected = $(this).hasClass("highlight");
    $("#data tr").removeClass("highlight");
    if(!selected)
            $(this).addClass("highlight");

var tr = $(this).closest('tr');
tr.detach();