Javascript 渲染。如何编写 Javascript 使其在函数调用结束之前不继续执行代码

Question

不确定我的问题是主观的还是客观的，但作为一个 JavaScript 新手，我经常遇到这个问题。所以我走了。

我习惯写 C#，所以我的 JavaScript 结构看起来像 C#。就是这样，我认为这会带来问题；-)让我们举一个简单的例子，我今天又遇到了我的问题:

MyLibrary.fn.InitAddEntityForm = function () {
    $('a#btnAddEntity').click(function () {
            //post data and receive object with guid and isPersisted boolean
            var persistedObject = MyLibrary.fn.CheckAndSendAddEntityForm("name", "avatarurl.png");
            console.log("test");

            //check if persisted and go to next step
            if (persistedObject.isPersisted) {
                MyLibrary.fn.InitAddAnotherEntityForm(persistedObject.gdEntityId);
            } else {
                alert("Oops, something went wrong. Please call 911");
            }
    });
};


//////*****/////
//SOME FUNCTION THAT SENDS MY FORM AND RETURNS AN OBJECT WITH TRUE VALUE AND POSTED ENTITY ID
/////*****//////
MyLibrary.fn.CheckAndSendAddForm = function (txtName, ImageUrl) {
var postUrl = "/admin/add";
var persistedObject = new Object();
$.post(
    postUrl,
    { Name: txtName, ImageUrl: txtImageUrl},
    function (data) {
        if (data.Status == 200) {
            console.log("Post status:" + data.Message);
            persistedObject.isPersisted = true;
            persistedObject.gdEntityId = data.Data;
        } else if (data.Status == 500) {
            console.log("Failed to post entitiy");
        } else {
            console.log("Fault with Javascript");
        }
    }, "json"
);
return persistedObject;

};

好的，就是这样。一切看起来都还好吧？浏览器说不。我尝试使用 firebug 对其进行调试，逐行遍历我的代码，这样浏览器就会执行我想要的操作:执行一个新函数以在我的向导中显示下一个面板。

在我的代码中放置了大量的 Console.logs() 之后，我发现这一定与 JavaScript 中的计时有关。在 C# 中，代码逐行执行，但显然 JavaScript 不会。通过放置 Console.log("test")，我注意到“测试”出现在我的控制台中，出现在“发布状态:成功!”之前。

所以这是我的问题，我应该如何编写我的 JavaScript 代码才能控制浏览器执行我的代码的方式？我真的应该将下面的代码替换到我的 CheckAndSendAddEntityForm() 的末尾吗？

//check if persisted and go to next step
        if (persistedObject.isPersisted) {
            MyLibrary.fn.InitAddAnotherEntityForm(persistedObject.gdEntityId);
        } else {
            alert("fout");
        }

这是我编写 JavaScript 的方式:一个巨大的多米诺骨牌效应还是我只是做错了什么？

Answer 1

$.post 是 AJAX 调用的快捷方式，AJAX 根据定义是异步的，这意味着它不会在继续处理之前等待响应。如果将其切换为常规 AJAX() 方法，则可以将异步选项设置为 false，这将使它按预期运行。

或者，您也可以定义一个函数以在 AJAX 请求成功返回时执行，您可以在其中调用流程链中的下一步。