jQuery Bootstrap多个模态，如何隐藏active / top模态

我有一个模态forms，有时需要打开第二个模态来设置或显示一些数据。 我可以启动第一个和第二个模态OK，但是当我关闭’top’模态时，两个模态都被隐藏了。 是否有可能一次隐藏一个模态？

显示模态一：

$('#content').on('click', "a#AddItemModal", function () { var id = $(this).attr('value'); var val = '/AddItems/id:' + id; $('#addItemBody').load(val); $('#addItemModal').modal({}); }); 

模态一：

 
 
 
 
 
 Close 
  

显示模态二：

 $('#test_embed').click(function () { var val = $('#formEmbed').val(); $('#myModalLabel').html('Embed Preview'); $('#embedBody').html(val); $('#embedModal').modal({}); }); 

模式二：

 
 
 
Embed Preview
 
 
 
 
 
 Close 
  

Answer 1

我认为您应该手动关闭模态，因为当您单击关闭按钮时，您会触发一个隐藏所有模态的“关闭”事件。 要手动关闭模态，请调用$('#addItemModal').modal('hide'); 对于第一个模态和$('#embedModal').modal('hide'); 。

现在你可以在你的模态中放一个按钮来调用这些：

模态一：

 
 ... 
 Close 
  

模式二：

 
 ... 
 Close 
  

使用Javascript：

 $("button[data-number=1]").click(function(){ $('#addItemModal').modal('hide'); }); $("button[data-number=2]").click(function(){ $('#embedModal').modal('hide'); }); 

Answer 2

我通常会确保第二个模态不是父模型中的子模态。 因为data-dismiss="modal"关闭当前模态和所有父模态。

所以尽可能使它成为：

不

或者我删除data-dismiss="modal"并指定类“close”，例如我想要用来关闭模态的链接或按钮然后使用一个jquery事件我可以关闭/隐藏关闭按钮模式。

  $('#mycontainer').on('click', '.modal .close', function () { $(this).closest('.modal').modal('hide'); }); 

Answer 3

只需将模态附加到正文 – 模态创建后

$('body').append('#addItemModal');

现在只关闭活跃的顶级模态