问题描述
我有一个模式,在尝试运行时会激活一个弹出框进行验证.我已经在弹出窗口中添加了一个超时以在 3 秒后隐藏.但是如果你关闭模式,超时功能似乎停止了,弹出框不会隐藏,甚至直接告诉它隐藏也不起作用.
I have a modal that when trying to run will activate a popover for validation. I've added a timeout to popover to hide after 3 seconds. But if you close the modal the timeout features seems to stop, the popover doesn't hide and even directly telling it to hide doesn't work.
模态html
<div class="modal hide fade" id ="password_modal">
<div class="modal-header">
<h3>Change Password <span class="extra-title muted"></span></h3>
</div>
<div class="modal-body form-horizontal">
<div class="control-group">
<label for="current_password" class="control-label">Current Password</label>
<div class="controls">
<input type="password" name="current_password">
</div>
</div>
<div class="control-group">
<label for="new_password" class="control-label">New Password</label>
<div class="controls">
<input type="password" name="new_password">
</div>
</div>
<div class="control-group">
<label for="confirm_password" class="control-label">Confirm Password</label>
<div class="controls">
<input type="password" name="confirm_password">
</div>
</div>
</div>
<div class="modal-footer">
<button href="#" class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button href="#" class="btn btn-primary" id="password_modal_save">Save changes</button>
</div>
</div>
模态框内
options = {
content: raw_data.errors,
html: true,
placement: 'top',
trigger: 'manual'
}
$('#password_modal_save').popover(options);
$('#password_modal_save').popover('show');
setTimeout(function(){ click.popover('hide'); }, 3000);
模态关闭监听器
$("body").on("hidden", "#password_modal", function(event){
$(this).remove(); //Remove the modal to stop duplications
$('#password_modal_save').popover('hide'); //Targetting the popover directly
$('.popover').remove(); //Last solution to actually hiding it
});
我希望有一种更简洁的方法来隐藏除 $('.popover').remove();
I'm hoping for a cleaner way to hide the popover other than $('.popover').remove();
小提琴:http://jsfiddle.net/La2yn/20/
推荐答案
使用 2.1.0 有一个 bug,当 modal 关闭时 popover 不隐藏.更新到 2.3.1,弹出框现在也关闭了模式 -.-
Using 2.1.0 there is a bug with popover not hiding when modal is closed. Updated to 2.3.1, the popover was now closing the modal as well -.-
添加了以下代码以阻止事件冒泡并关闭模式
Added in the following code to stop the event bubbling up and closing the modal as well
$("body").on("hidden", "#password_modal_save", function(e){
e.stopPropagation(); //Once popover is hidden stop the event from going to parent
});
这篇关于Bootstrap modal popover 关闭时隐藏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!