带对话框的 jQuery 延迟对象

Question

我有一个表单，如果有更改，我想提示用户保存更改。我正在尝试将 jQuery UI 对话框与 jQuery 延迟对象一起使用，但看到一些奇怪的行为。这就是我正在做的事情:

function clickEventHandler()
{
  if (checkForChanges())
  {
    $.when(dialogChanges()).then(clickEventHandler());
    return;
  }
};
function dialogChanges()
{
  var def;

  def = $.Deferred();
  $("#tmplUnsavedChanges").tmpl().appendTo("body");
    this.__dialog = $("#divUnsavedChanges").dialog({
      resizable: false,
      modal: true,
      buttons: {
      Continue: Function.createDelegate(this, function ()
      {
        this.__origTemplate = this.__newTemplate;
        this.__dialog.dialog("close");
        def.resolve();
      }),
      Cancel: Function.createDelegate(this, function ()
      {
        this.__dialog.dialog("close");
        def.reject();
      })
    }
  });

  return def.promise();  
}

因此，当我单击链接时，我会调用一个函数。它检查是否有更改，如果有，则启动返回延迟 promise 的对话框。但我发现它总是立即调用完成函数，进入竞争状态。但是，如果我这样调用它，它就会起作用。 $.when(dialogChanges()).then(function() { clickEventHandler()}); 为什么会这样呢？我还尝试使用 Function.createDelegate 将调用包装在 then() 内，但这也不起作用。

当我阅读完成 here 上的说明时，它似乎采用函数而不是在参数本身内创建函数。

无论如何，我可以保持原样，因为它可以工作，但只是想理解，这样我就不会在路上犯错误。

谢谢。

Answer 1

您的代码非常几乎是正确的。您需要从以下位置删除多余的大括号:

.then(clickEventHandler())

因为当前您正在立即调用该函数，并将其结果传递给 .then，而不是注册 clickEventHandler 作为 .then 回调，即:

.then(clickEventHandler)