引导在接近模态酥料饼皮(Bootstrap modal popover hide on close)

2019-09-01 13:48发布

我有尝试运行将启动用于验证的酥料饼当一个模式。 我添加了一个超时酥料饼在3秒钟后隐藏。 但是,如果你关闭超时功能似乎停止模态中,酥料饼不躲,甚至直接告诉它隐藏不起作用。

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();

小提琴: http://jsfiddle.net/La2yn/20/

Answer 1:

使用2.1.0有与模态时关闭没有隐瞒酥料饼的错误。 更新2.3.1,该酥料饼是现在关闭模式以及-.-

添加以下代码,以阻止事件冒泡和关闭模式,以及

$("body").on("hidden", "#password_modal_save", function(e){
    e.stopPropagation(); //Once popover is hidden stop the event from going to parent
});


文章来源: Bootstrap modal popover hide on close