带有对话框的 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();  
}

所以当我点击一个链接时我会调用一个函数。它检查是否有更改，如果有，它会启动返回延迟承诺的对话框。但我发现它总是会立即调用 done 函数进入竞争状态。但是，如果我改为这样称呼它，它就可以工作。 $.when(dialogChanges()).then(function() { clickEventHandler()}); 为什么会这样？我也尝试使用 Function.createDelegate 将调用包装在 then() 中，但这也不起作用。

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

无论如何，我可以保持原样，因为它有效，但只是想理解，所以我不会在路上犯错。

谢谢。

Answer 1

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

.then(clickEventHandler())

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

.then(clickEventHandler)