javascript - 将确认/取消弹出窗口插入 JQuery - CSS 问题

Question

我对 JQuery 还很陌生，我正在尝试制作一个简单的弹出消息来确认删除，但我希望在此过程中表格行变成红色。

我发现这段代码看起来很甜蜜、简短且简单。

$(document).ready(function(){
    $('.confirm').click(function(){
        var answer = confirm("Are you sure you want to delete this item?");
        if (answer){
            return true;
        } else {
            return false;
        }
    });
});

来自:http://brettgregson.com/programming/how-to-make-a-are-you-sure-pop-up-with-jquery/138

我正在“尝试”将其添加到我当前的deleteFunction()中，但我对 JQuery 仍然很陌生，并且我遇到了一些“错误”。

我的deleteFunction(没有确认 - 但颜色更新工作正常)

function deleteFunction(element) {
        var newID = $(element).closest("td").find("span.ID").text();
        $(element).closest("tr").css('background-color', 'red');
        $.post(
                '@Url.Action("customDelete", "Movie")',
                 {
                     'id': newID
                 },
                function (data) { },
                "json"
            );
        $(element).closest("tr").hide();
    }

我插入的确认框有效，但不会更新 tr 背景颜色，也不会在取消时将颜色恢复为默认值。

function deleteFunction(element) {
    var newID = $(element).closest("td").find("span.ID").text();
    $(element).closest("tr").css('background-color', 'red');

    $(document).ready(function () {

        var answer = confirm("Are you sure you want to delete this item?");
        if (answer) {
            $.post(
        '@Url.Action("customDelete", "Movie")',
        {
            'id': newID
        },
        function (data) { },
        "json"
        );
            $(element).closest("tr").remove();
            return true;
        } else {
            $(element).closest("tr").css('background-color', 'default');
            return false;
        }
    });


}

如果有人能解释为什么在出现确认框之前 CSS 颜色不会被触摸(或者为什么在按下“取消”后不会删除颜色)，我们将非常感激。

Answer 1

我已经为你创建了一个jsfiddle: working sample 。至于清除颜色，您应该使用css('background-color', 'initial')。至于突出显示 - 它应该突出显示，就像示例一样。如果它没有帮助，那么请随意透露您的 html 标记，很可能问题就在那里