当用户在 Twitter 引导程序 3.1 模态对话框之外单击时，如何防止在单击事件之前发生模糊事件。！答案

【问题标题】：How to prevent blur event before click event in twitter bootstrap 3.1 modal dialog when user clicks outside of it.!当用户在 Twitter 引导程序 3.1 模态对话框之外单击时，如何防止在单击事件之前发生模糊事件。！
【发布时间】：2014-06-27 00:09:17
【问题描述】：

我正在使用 twitterbootstrap 3.1.0 并且我有一个模态。我希望每当用户在模态外部单击时隐藏模态（所以我使用了 data-backdrop="true" 并且工作正常。）

并且我的模态对话框有一个具有字段验证的焦点输入元素，只要显示模态对话框，该输入框就会被聚焦。在该输入框模糊时，会发生验证并相应地引发错误。（我希望这个逻辑保持不变一样）。！！

我的问题是每当用户在模态对话框外单击时，它就会消失并显示错误消息（输入字段的字段验证）。由于在单击之前触发了模糊事件，它会显示错误消息，然后模态对话框消失。

我不希望在隐藏模式对话框之前显示字段验证消息。

请帮忙！提前致谢。

【问题讨论】：

一些相关代码会有所帮助。
请尝试提出建议。

标签： jquery css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

Blur 在点击之前触发，您无法更改它。我的建议是将验证从模糊移到按钮单击上（我猜你必须有一个确定或提交按钮）。这将解决您的问题。

我也有一些技巧（我建议不要这样做）。由于您遇到此问题，我假设您的模态使用动画隐藏

隐藏模式而不使用动画。该消息仍会存在，但您将没有时间查看它。
如果您想知道动画时间，您可以在该时间之后使用 setTimeout 来检查模态是否仍然可见。如果是，则显示错误消息，否则不显示。

说modal需要1秒才能消失，你可以试试这样的

// Inside blur callback function

setTimout(function(){
    if($("#modal").is(":visible")) {
        // show error message
    }
},1100); //1.1 seconds

我仍然希望在您的场景中将验证从模糊中移开:)

【讨论】：