Question

我正在使用带有模板引擎的PHP框架（Fat Free F3）来拼凑我正在处理的设计。主模板和所有.js文件都在layout.htm上加载。在layout.htm中，我有一个链接，当单击时，触发要在bootstrap模式窗口内显示的url的内容。以下是该代码：

<a href="/this/is/my/url" class="btn black mini icn-only" data-toggle="docs"><i class="icon-lock icon-large icon-white"></i></a>

<script>    
$(document).ready(function() { 
    $('[data-toggle="docs"]').click(function(e) {
        e.preventDefault();
        var url = $(this).attr('href');
        if (url.indexOf('#') == 0) {
            $(url).modal('open');
        } else {
            $.get(url, function(data) {
                $('<div class="modal container hide fade" tabindex="-1" data-width="820"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button><h3 class="page-title">Title! <small> small txt</small></h3></div><div class="modal-body">' + data + '</div></div>').modal();
            }).success(function() { $('input:text:visible:first').focus(); });
        }
    });
</script>

在这个网址（/ this / is / my / url）中，我正在尝试使用以下代码使用bootstrap工具提示功能：

<button class="btn tooltips" data-placement="top" data-original-title="Tooltip in top">Top</button>

工具提示未显示在模态窗口内部，但如果我将其添加到模态窗口之外的主页面，则它正在工作。所以我的问题是，在使用这个模板引擎时，如何让工具提示（或任何其他引导程序jquery事件）在模态窗口内工作？我应该在模态窗口内重新加载bootstrap .js文件吗？

令我困惑的是css似乎工作正常，因为模态窗口包含一个引导表。我认为jquery也会起作用，但我显然是错的。

绝对任何反馈都会有所帮助。谢谢！

Answer 1

将此添加到您的jQuery以启动tooltip，因为它所绑定的元素在页面加载时不可见：

$(document).on('click', '[data-toggle="docs"]', function() {
    $('.tooltips').tooltip();
});

将html加载到bootstrap模式中，在模态中打破jquery

1 个答案: