单击后如何延迟Bootstrap 3模式的显示 [英] How to delay display of Bootstrap 3 modal after click
本文介绍了单击后如何延迟Bootstrap 3模式的显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我试图在用户点击触发按钮后延迟显示Bootstrap模式:
I'm trying to delay the display of a Bootstrap modal after the user has clicked on a trigger button:
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
查看Bootstrap 3文档我可以看到有一个 show
可以挂钩但不确定如何在模式出现在屏幕上之前引入3秒延迟的事件。希望有人可以提供帮助?
Looking at the Bootstrap 3 documentation I can see there is a show
event that can be hooked to but am not sure how to introduce a 3 second delay before the modal appears on screen. Hoping someone can help?
参考:
http://getbootstrap.com/javascript/#modals
推荐答案
您可以延迟点击触发按钮,然后直接激活模态:
You can delay the click of the trigger button, then activate the modal directly:
$('[data-toggle=modal]').on('click', function (e) {
var $target = $($(this).data('target'));
$target.data('triggered',true);
setTimeout(function() {
if ($target.data('triggered')) {
$target.modal('show')
.data('triggered',false); // prevents multiple clicks from reopening
};
}, 3000); // milliseconds
return false;
});
http://jsfiddle.net/mblase75/H6UM4/
这篇关于单击后如何延迟Bootstrap 3模式的显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文