Div.Show在运行时不起作用，但在单步执行代码时起作用 [英] Div.Show does not work when running, but does work when stepping through code

问题描述

保存时我应显示一个div.标记与此类似:

I have a div that should appear when saving. The markup for this is similar to this:

<div class="Working" style="display: none;">Message</div>

稍后在我的代码中，我有一些保存逻辑，它可以这样做:

Later in my code I have some save logic, which does this:

function SaveData() {
    var cancelSave = false;

    $('.Working').text('Saving data ...').show();
    var saveData = { 'Data': myData }; // Actually a lot of logic in here

    if (cancelSave) {
        $('.Working').hide();
    } else {
        $.ajax({
            // bunch of stuff here
            async: false, // tried this both ways
            error: function (rsp) {
                $('.Working').hide();
            },
            success: function (rsp) {
                $('.Working').text('Saved');
                $('.Working').fadeOut(5000, DoNothing());
            }
        });
    }
}

function DoNothing() {
    // Does nothing
}

如果我单步执行代码，则在单步.show()行时div会完美显示.但是，当我以全速"运行此命令时...我再也看不到正在保存数据..."消息.实际的保存过程大约需要5到7秒，因此有足够的时间来查看消息.

If I step through the code, the div shows up perfectly when I step through the initial .show() line. However, when I run this at "full speed" ... I never see the "Saving data ..." message. The actual save does take about 5-7 seconds, so there is plenty of time to see the message.

推荐答案

UI被锁定，因为ajax async属性设置为false.将其设置为true并尝试. SaveData方法将完成，更新UI以显示正在保存数据..."文本，然后在ajax调用返回时再次更新.

The UI is locked up because the ajax async property is set to false. Set it to true and try it. The SaveData method will finish, update the UI to show the "saving data..." text and then update again when the ajax call returns.

这篇关于Div.Show在运行时不起作用，但在单步执行代码时起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！