jquery - 单击简单模态中的链接以打开新的简单模态

Question

因此，我希望我的用户能够单击简单模态 jquery 框中的链接，并让它关闭当前模态框并打开一个包含新内容的新模态框。

到目前为止这还没有奏效:

$('#search_dialog_link').click(function () {
        $("#search_dialog").modal(
            {
                position: [150,125],
                minWidth: 400
            }
    );
});    

$('#create_course_link').click(function() {
   $.modal.close();
   $('#add_course_dialog').modal(
       {
        position: [150,125],
        minWidth: 400
       }
    );
});

其中 #search_dialog_link、#create_course_link、#search_dialog 和 #add_course_dialog 是这样建立的:

<div id="default-content">
This is the page where all of your classes and a list of upcoming assignments will be displayed.
Since you do not have any classes, why not try to add one by clicking the link below.<br><br>
<center><div id="search_dialog_link">+Add a Course</div></center>
</div>
</div>
<div id="search_dialog">
<p>Search for the teacher of your class:</p>
<form id="searchform"><input type="text" width="200px" size="30" value="" id="inputString" />
<div style="font-size: 10; position:relative; bottom:20px; left: 200px;">Dont see it?<div id="create_course_link">Create</div> a new class.</div>
</form>
</div>
<div id="add_course_dialog">
<p>Test</p>
</div>

请注意，#search_dialog 框会正确打开，并且当用户单击 div #create_course_link 时，原始模式框会关闭。但新的模态框不显示。我做错了什么？

Answer 1

v1.4.1 中存在一个“错误”，可能导致该问题。为了解决 Opera 问题，在 close 函数中有一个 setTimeout 调用。

要解决此问题，您可以按如下方式更新代码:

$('#create_course_link').click(function() {
   $.modal.close();

   setTimeout(function () {
      $('#add_course_dialog').modal(
      {
       position: [150,125],
       minWidth: 400
      }
      );
   }, 20);
});