將Bootstraps Popover設置爲'點擊'或'手動'從'懸停'。

Question

我一直在努力在引導程序的彈出窗口中嵌入一個交互式元素（搜索功能）。我還沒有能夠測試它的功能，因爲我似乎無法像使用javascript或標記一樣將事件設置爲「點擊」而不是「懸停」。我是一位js初學者，所以請耐心等待。

<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(); 
      } 
      });