twitter-bootstrap - Bootstrap 2.3.1 弹出窗口导致父模式关闭

标签 twitter-bootstrap modal-dialog jquery popover

我遇到了一个问题,我在 Bootstrap 模式中显示一些数据。该数据包含一个图标,我将其变成弹出窗口。当我将鼠标悬停在图标上时,弹出窗口会显示并且一切正常,但是当我将鼠标移开图标时,不仅弹出窗口会关闭,而且父模式也会关闭。

我认为这与 here 描述的问题相同。但是,发布的解决方案对我不起作用。我正在捕获弹出窗口的“隐藏”事件,但设置 e.cancelBubble = true 或调用 e.stopPropagation() 都不会阻止父模态关闭。

目前我面前没有代码,但这是一个基于我的一般内存的粗略模型......

HTML

<小时/>
<!-- ko with: myFoo -->
<div class="modal hide fade" data-bind="visible: isOpen">
    <div class="modal-header">
        <button type="button" class="close" data-bind="click: close">&times;</button>
        <h3>Title Bar!</h3>
    </div>
    <div class="modal-body">
        <!-- dynamically generated modal content goes here, including... -->
        <table>
            <tr>
                <td data-bind="popover: $data">
                    <i class="icon-question-mark" data-content="la la la..." />
                </td>
            </tr>
        </table>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn" data-bind="click: close">Close</a>
    </div>
</div>
<!-- /ko -->
<小时/>

Knockout 自定义绑定(bind)处理程序

<小时/>
ko.bindingHandlers.popover = {

    init: function(element)
    {
        $(element).children().andSelf().on("mousenter", "[data-content]"function() {
            var options = {...}
            $(this).popover(options).on("hidden", function(e) {
                e.cancelBubble = true;
                e.stopPropagation();
            });
        });
    }
};

有人对如何解决这个问题有任何想法/建议吗?

最佳答案

感谢 afanasy 在评论中提到了这一点:

$("[data-toggle=popover]").on("hidden", function (e) {
   e.stopPropagation();
});

注意:“隐藏”而不是“隐藏”。这是针对 bootstrap 2.3.2 的。

关于twitter-bootstrap - Bootstrap 2.3.1 弹出窗口导致父模式关闭,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17604895/

相关文章:

html - Bootstrap Navbar 品牌形象在崩溃时被压低

jquery - Bootstrap datepicker 意外地触发另一个事件处理程序中的更改事件

css - Bootstrap3选择框显示两个框

javascript - AngularJS - 在 Controller 中打开 $mdDialog

javascript - $(document).ready(function() 外部头

javascript - Bootstrap : Input boxes go offscreen when making individual rows

css - Twitter Bootstrap 模态窗口不出现

jquery 模式对话框 onclick?

javascript - jQuery 轮播问题 : How do i stop the thumbnails from advancing?

jquery - 如何将 Bootstrap 标签绑定(bind)到动态创建的元素?