Question

这可能是一个非常简单的问题，但我找不到答案。如何在popover中隐藏和显示标题？

        var i = 1;

    function ShowHideTitle() {
        if (i == 1) {
            $('#txt2').attr("data-original-title", "Error");
            $('#txt2').attr("data-content", "Message is error");
            $('#txt2').attr("data-trigger", "hover");
            $('#txt2').attr("data-toggle", "tooltip");
            $('#txt2').attr("data-placement", "bottom");
            $('#txt2').popover({ container: 'body' }).popover('show');
            i = 2;
        } else {
            $('#txt2').attr("data-original-title", "");
            $('#txt2').attr("data-content", "Message is Good");
            $('#txt2').attr("data-trigger", "hover");
            $('#txt2').attr("data-toggle", "tooltip");
            $('#txt2').attr("data-placement", "bottom");
            $('#txt2').popover({ container: 'body' }).popover('show');
            i = 1;
        }
    }

当我尝试上面的代码时：

迭代1：带有标题和内容的弹出窗口

迭代2：没有标题和内容的popover

迭代3：popover没有标题和内容（我希望这个与迭代1相同，但它不再显示标题（标题）。

任何帮助？

这是页面HTML：

<html lang="en">

Temp_Free

<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/bootstrap-theme.min.css" rel="stylesheet" />

<link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css" />

<!-- Site -->
<link href="css/fonts.css" rel="stylesheet" />
<link href="css/site.css" rel="stylesheet" />

<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="js/site.js"></script>
<script type="text/javascript" src="js/moment.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/bootstrap-datetimepicker.min.js"></script>

<div class="container">
    <div class="row">
        <input id="txt2" value="TextBox2" />
        <button type="button" onclick="ShowHideTitle();">Click Me!!!!</button>
    </div>
</div>
<script>

    var i = 1;

    function ShowHideTitle() {
        if (i == 1) {
            $('#txt2').attr("data-original-title", "Error");
            $('#txt2').attr("data-content", "Message is error");
            $('#txt2').attr("data-trigger", "hover");
            $('#txt2').attr("data-toggle", "tooltip");
            $('#txt2').attr("data-placement", "bottom");
            $('#txt2').popover({ container: "body" }).popover('show');
            i = 2;
        } else {
            $('#txt2').attr("data-original-title", "");
            $('#txt2').attr("data-content", "Message is Good");
            $('#txt2').attr("data-trigger", "hover");
            $('#txt2').attr("data-toggle", "tooltip");
            $('#txt2').attr("data-placement", "bottom");
            $('#txt2').popover({ container: "body" }).popover('show');
            i = 1;
        }
    }
</script>

Answer 1

是的，你可以用一点$stateProvider .state('search', { url: '/search?query', }) ; $urlRouterProvider.otherwise("search");来执行它。这是JS：

base_url?query=x

在我进入超时之前，destroy调用没有时间完成，并且会导致弹出窗口显示然后立即隐藏。

请参阅example

Bootstrap popover覆盖标题并保持样式

1 个答案: