3

使用 Bootstrap 弹出框，弹出框不会出现在悬停时。它仅在我单击链接时出现。我很感激任何帮助。TIA

    <script type="text/javascript">
    $(function () {
        $('body').popover({
            html: true,
            content: function () {
                return $(this).next().html();
            },
            selector: '.has-popover'
        })
    });
</script>

<body>
<form id="form1" runat="server">
    <div id="div1" style="margin: 80px 0 0 20px;" runat="server">
        <a id="A1" style="text-decoration-style: dashed; text-decoration: dashed;" class="has-popover" href="#" rel="popover" data-placement="right" data-original-title="Title Goes Here!" data-trigger="hover">Hover for popover</a>
        <div id="Div3" style="display: none">
            <div style="float: left; width: 15%;">
                <img style="max-height: 75px; max-width: 75px;" src="style/x.png" />
            </div>
            <div style="float: left; width: 85%;">
                <ul>
                    <li>blah blah blah</li>
                    <li>yada yada yada</li>
                    <li>blah blah blah</li>
                </ul>
            </div>
        </div>
    </div>
</form>

4

3 回答 3

3

By default popover is triggered by click, not hover.

You can change it by adding option:

trigger: 'hover'

So your script should look like:

<script type="text/javascript">
    $(function () {
        $('body').popover({
            html: true,
            content: function () {
                return $(this).next().html();
            },
            selector: '.has-popover',
            trigger: 'hover' // Add this option
        })
    });
</script>
于 2013-09-04T14:35:58.523 回答
0

Pass trigger as an option to popover:

$('body').popover({
            html: true,
            content: function () {
                return $(this).next().html();
            },
            selector: '.has-popover',
            trigger: 'hover'
})
于 2013-09-04T14:36:24.943 回答
0

下面是工作的jsfiddle检查出来

http://jsfiddle.net/2DAZ2/43/

还用“选择器”检查弹出框的问题

所以你需要在启动时传递额外的参数

https://github.com/twbs/bootstrap/issues/4990

$('body').popover({
            html: true,
            content: function () {
                return $(this).next().html();
            },
            selector: '.has-popover',
            trigger: 'hover'
})
于 2013-09-04T14:42:53.380 回答