Question

我具有以下创建对话框的功能，并使用jQuery延迟来等待用户响应：

function myPageUnsaved() {
    var defer = $.Deferred();
    $('<div></div>')
    .html('You have unsaved changes. Leave this page and lose your changes?')
    .dialog({
        autoOpen: true,
        modal: true,
        title: 'Confirmation',
        buttons: {
            "No": function () {
                defer.resolve("false");
                $(this).dialog("close");
             },
             "Yes": function () {
                defer.resolve("true");
                $(this).dialog("close");
             }
        },
        close: function () {
            $(this).dialog('destroy').remove();
        }
    });
    return defer.promise();
}

我在下面的js中调用该函数：

// function to check for user changes prior to navigating to a new page
function checkPageChange() {
    if (pageChanges == true) {
        myPageUnsaved().then(function (answer) {
            // if user answered no, stay on the page
            if(answer == 'false') {
                return false;
            // else the user answered yes, so leave the page
            } else {
                return true;
            }
        });

    } else {
        return true;
    }
}

我正在运行jQuery 1.11。

对话框显示给用户，但立即将其删除。我想念什么？

Answer 1

使用的模式似乎正确，我的最初答案不正确。 .promise是一个延迟的方法，所有成员方法都可以在此处看到。 http://api.jquery.com/category/deferred-object/

原始海报提供的代码示例似乎可以在jsfiddle中使用

https://jsfiddle.net/n7ewqfc0/

初始答案-错误的假设

您是否尝试过仅返回defer而不是defer.promise（）；在我看来，这不合适。

查看Deferred的规范，没有引用promise方法。 https://api.jquery.com/jquery.deferred/

很显然，我已大大简化了您的代码以提供可解决的Promise，但是原理是相同的。您必须返回承诺对象，即Deferred才能使用基于承诺的回调.then等。

function myPageUnsaved() {
    var defer = $.Deferred();
    setTimeout(function(){
        defer.resolve('hey back from inside the promise')
    }, 2000)
    return defer;
}

var p = myPageUnsaved()
p.then(function(response){
  console.log(response)
})

为什么使用Deferred的jQuery对话框不等待用户选择？

1 个答案: