獲取酥料餅留在jQuery的

開我有一些jQuery代碼看起來像這樣：獲取酥料餅留在jQuery的

// compile template through underscore templating  
var compiledTmpl = _.template(eventTemplate); 

// configure popover settings and dynamic mark up 
jQuery(this).closest(".item").popover({ 
    trigger:'manual', 
    html:true, 
    "content":compiledTmpl(eventData), 
    "template": popoverTemplate 
}); 

// show the popover 
jQuery('.field-content').hover(function(){ 
    jQuery(this).closest(".item").popover('show'); 
}); 

jQuery(this).popover().mouseout(function (e) {  
    jQuery(this).closest(".item").popover('hide');  
});

我想有酥料餅保持開放，當我去到老鼠進去，但不管我怎麼努力，它一直躲藏起來。有人知道爲什麼或者有沒有人可以幫助我？

來源

2014-02-14 scapegoat17

我終於能夠從這個職位找出解決我的問題上SO： How can I keep bootstrap popover alive while the popover is being hovered?

雖然不是標記的答案，因爲我沒有看到它適合完全回答我的問題，我使用@OkezieE發佈的答案：

這是我的最終代碼的樣子：

// compile template through underscore templating  
var compiledTmpl = _.template(eventTemplate); 
// configure popover settings and dynamic mark up 
jQuery(this).closest(".item").popover({trigger:'manual', html:true, 
    "content":compiledTmpl(eventData), "template": popoverTemplate}) 
// show the popover and allows popover to stay open on mouseenter 
.on("mouseenter", function() { 
    var _this = this; 
    jQuery(this).popover("show"); 
    jQuery(".popover").on("mouseleave", function() { 
     jQuery(_this).popover('hide'); 
    }); 
}).on("mouseleave", function() { 
    var _this = this; 
    setTimeout(function() { 
     if (!jQuery(".popover:hover").length) { 
      jQuery(_this).popover("hide"); 
     } 
    }, 100); 
});

我打算把這個標記爲我的答案，因爲它對我有用。

來源

2014-02-17 20:15:40 scapegoat17

這裏的問題在於彈出窗口並未連接到DOM元素。所以當你移動你的鼠標時，你正在離開觸發區域。我在使用mousein/mouseout設計解決方案時遇到了困難，因爲用戶需要從觸發區域移動到彈出窗口，並且它們之間存在「死空間」。

如何改變點擊？然後彈出窗口將被點擊切換。也許會延遲一段時間，所以它會在一段時間後自動關閉。使用點擊的另一個優點是觸摸用戶也可以看到彈出窗口。

來源

2014-02-14 22:37:00 emptywalls

我看到你在說什麼，我仍然覺得我必須保留它作爲懸停選項，點擊不起作用，因爲除了懸停選項之外，它實際上鍊接到另一個頁面。如果您有任何問題，我願意使用任何其他類型的解決方案？ – scapegoat17

你可以嘗試從鼠標移出排除酥料餅的容器：

jQuery(this).popover().mouseout(function (e) { 
    var target = $(e.target); 
    if (!target.parents('.popover').length && !target.hasClass('.popover')) { 
     jQuery(this).closest(".item").popover('hide'); 
    } 
});

來源

2014-02-14 23:02:44 Igor

對不起，如果語法有點關閉，我目前無法測試。 – Igor

你的語法對我來說似乎很有用。不幸的是，我似乎仍然會在彈出窗口中顯示類似的結果，但是如果我嘗試訪問彈出窗口內的任何內容，則不起作用。你還有其他建議嗎？ – scapegoat17

獲取酥料餅留在jQuery的

回答

相關問題