Question

我有一个应用程序，客户有任务。要为客户创建新任务，您可以单击添加图标，该图标将打开显示新任务表单的fancybox。这有以下咖啡脚本：

jQuery ->
  $("a.fancyForm").fancybox
  scrolling: "no"
  titleShow: false

然而，客户也必须有一个目标，否则任务是徒劳的。所以关系真的是客户有很多目标，有很多任务。如果客户已经有一些目标，那么表单只会询问您的目标是什么。如果客户没有目标，那么我想弹出一个确认框，询问用户是否想要立即实现目标。这是我目前的咖啡脚本：

$("a.noGoals").click (e) ->
  e.preventDefault()
  confirm_create_goal = confirm("There is currently no Goal for this customer. Would you like to create one?")
  if confirm_create_goal
    $("a.noGoals").fancybox()
  else
    alert "You won't be able to create tasks until a goal is created!"

这会打开确认框，单击确定似乎什么都不做。如果您再次尝试它会显示确认框，如果您单击确定或取消它会显示正确的fancybox与我的新目标表单。我如何让这个第一次工作？似乎第一次点击ok它只设置confirm_create_goal然后只在第二次尝试时打开fancybox。

如果我在第一次尝试时单击“取消”，它会正确显示警报。第二次尝试我点击“确定”没有fancybox。第三次尝试命中“ok”得到fancybox但是如果我点击“取消”我得到警报然后fancybox o.O

Answer 1

应该在页面加载时调用fancybox（），而不是响应click事件。调用fancybox（）只是创建fancybox并附加监听器等。它只是配置它。它没有显示出来。

这是我没有使用fancybox的原因之一，因为它的API很弱。没有手动显示它的方法。除非你使用fancybox 2.这是一个如何工作的例子：

http://jsfiddle.net/9wAdV/1/

Answer 2

所以事实证明，如上所述调用fancybox只是将它附加到click事件，而不是调用它。因此，当您再次单击时，无论您的确认框响应如何，它都会显示现在附加到点击事件的fancybox。

我的解决方案虽然不确定它是否是最好的，但是使用.on（）和.off（）来绑定和取消绑定确认框，然后我可以在$（“a.noGoals”）之后触发fancybox。 fancybox（）调用：

confirm_create_goal = (e) ->
  e.preventDefault()
  confirm_create = confirm("There is currently no Goal for " + $(this).data("customer") + "'s company, " + $(this).data("company") + ". Would you like to create one?")
  if confirm_create
    $("body").off "click", "a.noGoals", confirm_create_goal
    $("a.noGoals").fancybox(onClosed: ->
      $("body").on "click", "a.noGoals", ->
        alert "Create a Goal!"
    ).trigger "click"
  else
    alert "You won't be able to create tasks until a goal is created!"

$("body").on "click", "a.noGoals", confirm_create_goal

因此，函数confirm_create_goal弹出一个确认框，如果你点击取消就会发出警告，如果你单击确定它会从链接中取消绑定，添加fancybox并触发链接上的click事件。这将打开fancybox，一切都正确显示。最后，我添加了一个警告绑定到链接（如果用户关闭框并尝试创建任务），提醒他们创建目标。

在fancybox之前显示一个确认框

2 个答案: