多级 jQuery 对话框

Question

我正在尝试使用模态行为实现多级 jQuery Dialog。我有一个主页，它打开了第一个对话框，从那里可以打开第二个对话框，所有这两个对话框都应该是模态框。

第一个问题是我在 fiddle 上单击主页 link 时出现错误，第二个问题是它没有按要求创建对话框。

Answer 1

发生了一堆事情：

在jsFiddle中，需要添加jQuery UI和一个主题作为外部资源。仅选择 jQuery 库是不够的。 jQuery UI 对话框是 jQuery UI 库的一部分，而不是 jQuery 核心库的一部分。
由于您的点击事件发生在 <a> 标签上，您需要取消它们的默认行为。为您的 <a> 标签创建点击处理程序，并在执行任何其他操作之前先取消默认行为：
```
<a href="#" id="clickForGold">Gold</a>

$("#clickForGold").on("click", function(e) {
  e.preventDefault();   <--- this stops the link from navigating
  //now do other stuff
});
```
在页面加载时设置对话框，然后在需要时打开它们。使用 autoOpen:false 参数防止它们在页面加载时打开。打开它们如下：
```
$("dialog-id").dialog("open");
```

不要在模态上打开模态。它的可用性非常差。在打开第二个之前关闭第一个：

function clickForSecond() {
  $("dialog-id-first").dialog("close");
  $("dialog-id-second").dialog("open");
}

Multiple level of jQuery Dialog