Question

我一直致力于在bootstrap的popover中嵌入一个交互元素（搜索功能）。我无法测试它的功能，因为我似乎无法将jcc或标记中的事件设置为“click”而不是“hover”。我是新手，所以请耐心等待。

<div class="popover-markup"> <a href="#" class="trigger">Search</a>
    <div class="head hide">Find an Action</div>
    <div class="content hide">
        <input class='input-block-level' id='search_address' placeholder='Enter an address or an intersection' type='text'>
        <select class='input-small' id='search_radius'>
            <option value='400'>2 blocks</option>
            <option value='805'>1/2 mile</option>
            <option value='1610'>1 mile</option>
            <option value='3220'>2 miles</option>
        </select>
         <h4>Find a School or Campus</h4>
        <input class='input-block-level' id='text_search' placeholder="Find a School or Campus" type='text' data-provide="typeahead">
        <input class='btn btn-primary' id='search' type='button' value='Search'>
        <button class='btn' id='reset'>Reset</button>
    </div>
    <div class="footer hide">test</div>

这是js：

$('.popover-markup>.trigger').popover({ 
    html : true,
    title: function() {
        return $(this).parent().find('.head').html();
    },
    content: function() {
        return $(this).parent().find('.content').html();
    }
});

感谢任何帮助。谢谢！

Answer 1

请记住添加正确的触发器： http://twitter.github.io/bootstrap/javascript.html#popovers

$('.popover-markup>.trigger').popover({ 
            html : true,
        --> trigger: 'hover',
            title: function() {
            return $(this).parent().find('.head').html();
            },
            content: function() {
            return $(this).parent().find('.content').html();
            }
            });

将Bootstraps设置为“点击”或“悬停”中的“手动”。

1 个答案: