关闭引导模式而不使用“隐藏”和“数据关闭”

Posted 2023-05-08

【中文标题】关闭引导模式而不使用“隐藏”和“数据关闭”

【英文标题】：Close bootstrap modal without using "hide" and "data-dismiss"

【发布时间】：2013-06-03 02:15:34

【问题描述】：

我想有条件地关闭引导模式框。如果我使用 $('#modal').modal('hide'); 这个，我的代码出了点问题。如果我在 html 模板中使用 data-dismiss="modal"，模态关闭操作会在我的实际功能应该在按钮单击时执行之前执行。

那么，还有其他方法可以关闭引导模式或在运行时使用data-dismiss="modal" 吗？

【问题讨论】：

阐述清楚你想在什么情况下隐藏？

这个库可能对bootboxjs.com/index.html#about有帮助

【参考方案1】：

您可以通过使用data-dismiss 属性本身的自动模式关闭行为或手动模式打开（我猜你目前正在这样做），通过订阅hide 事件并使用preventDefault事件。

$('yourmodalselector').on('hide',function(e)
   if(yourConditionNotToCloseMet)
      e.preventDefault();
   
);

Demo

Demo2

见Documentation

当 hide 实例方法被调用时立即触发隐藏事件事件，该方法被调用枯萎的方式，这是防止模式关闭的最佳位置。

【讨论】：

请问data-dismiss的编码是从哪里来的？

@PardeepJain 对不起，我不明白你的问题。

我的意思是我知道data-dismiss 用于关闭模式。但是代码已经写了相同的地方。即data-dismiss 是 bootstrap.js 或 .css 或其他任何人的代码？

它应该在引导实现中，您可以在模板上使用它。

在 bootstrap.js 或 bootstrap.css 中？

【参考方案2】：

制作另一个这样的按钮

<button type="button" class="btn btn-warning btn-lg shiny" data-dismiss="modal" aria-hidden="true">Cancel</button>

此按钮包含data-dismiss="modal"。您可以根据需要隐藏它。

现在您可以以自定义方式使用任何其他功能，当您想要隐藏模式时，您可以调用

$(".btn-warning").click();