如何确保在导航到另一个页面之前完全执行函数

How to ensure that a function is executed completely, before navigating to another page?

本文关键字：函数 执行 另一个 何确保 确保 导航      更新时间：2023-09-26

我正在使用网络服务删除某些记录。jquery ajax 请求是在超链接的点击中写入的。当我使用Firebug逐行执行脚本时，它被删除，否则不会。以前有没有人遇到过这样的情况？请帮忙

代码示例：

 $(".target").click(function() { 
            func();  //This function should be executed completely before navigating to another page
        });

 var func = function() {
            var items = $("#flag").find('td input.itemClass');
            id = items[0].value;
            var status = items[1].value;
            var type = items[2].value;
            var params = '{' +
                            'ID:"' + id + '" ,Type:"' + type + '" ,Status:"' + status + '"}';
            $.ajax({
                type: "POST",
                url: "WebMethodService.asmx/DeleteItem",
                data: params,
                //contentType: "plain/text",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    $("#deleteNotificationMessage").val("Item has been removed"); // keep a separate label to display this message
                }
                //Event that'll be fired on Success
            });

    }

jQuery ajax 函数返回延迟对象，因此我们return $.ajax .然后你应该使用延迟。done在 AJAX 完全完成后执行回调。当 AJAX done 时，请改用 JS 导航离开：

var func = function() {
    ...
    return $.ajax({...});                   //return our ajax deferred
}
$(".target").click(function() { 
    var target = this;                      //preserve "this" since this in the callback may be different 
    func().done(function(){                 //our done callback executed when ajax is done
        window.location.href = target.href; //assuming .target is a link
    });
    return false;                           //prevent the natural click action
});
您可以使用等待

完成调用的 ajax 调用上的async: false。

var func = function() {
            var items = $("#flag").find('td input.itemClass');
            id = items[0].value;
            var status = items[1].value;
            var type = items[2].value;
            var params = '{' +
                            'ID:"' + id + '" ,Type:"' + type + '" ,Status:"' + status + '"}';
            $.ajax({
                type: "POST",
                async: false,
                url: "WebMethodService.asmx/DeleteItem",
                data: params,
                //contentType: "plain/text",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    $("#deleteNotificationMessage").val("Item has been removed"); // keep a separate label to display this message
                }
                //Event that'll be fired on Success
            });
    }

或者，您可以在请求后提交。

$(".target").click(function() { 
            func();  //This function should be executed completely before navigating to another page
            return false;
        });
var func = function() {
            var items = $("#flag").find('td input.itemClass');
            id = items[0].value;
            var status = items[1].value;
            var type = items[2].value;
            var params = '{' +
                            'ID:"' + id + '" ,Type:"' + type + '" ,Status:"' + status + '"}';
            $.ajax({
                type: "POST",
                async: true,
                url: "WebMethodService.asmx/DeleteItem",
                data: params,
                //contentType: "plain/text",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    $("#deleteNotificationMessage").val("Item has been removed"); // keep a separate label to display this message
                    $("#YourFormID").submit();
                }
                //Event that'll be fired on Success
            });
    }

只需将事件移动到 ajax 请求中的"成功"处理程序：

 $.ajax({
            type: "POST",
            url: "WebMethodService.asmx/DeleteItem",
            data: params,
            //contentType: "plain/text",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                $("#deleteNotificationMessage").val("Item has been removed");
                //Event that'll be fired on Success
            }              
        });

或者使用 jQuery ajax 回调方法。

相关文章：