Twitter Bootsrap：彈出窗口和自動刷新

Question

我正在使用Twitter Boostrap進行網站重新設計，並且我需要一些jQuery幫助。我使用與bootstrap打包在一起的'Popover'附加組件，並且我在#div標籤（#onlinedata是特定的）中使用它，並且我正在使用jquery每10秒重新加載一次div。這很好，但是，如果你碰巧懸停在激活彈出窗口的div刷新時，popover卡住了。

我使用刷新驗證碼

setInterval(function(){ 
     $("#onlinedata").load("http://website.com #onlinedata"); 
}, 10000); 

，如果需要，可激活酥料餅代碼：

$(function() { 
     $('a[rel=popover]').popover({ 
      placement:'right', 
      title:'Title', 
      content: $('#div-that-contains-data').html() 
     }); 
}); 

有沒有辦法避免被卡住的酥料餅當div重新加載時打開？

任何幫助是極大的讚賞。

---

相關的HTML

的$id是每個酥料餅的，因爲我有多個popovers的關鍵具體。

被隱藏，直到popover_controller的酥料餅的部分懸停：

<div id="controller_popup_$id" style="display:none;"> 
    <div style="font-size:11px"> 
     //data_fetched_from_database 
    </div> 
</div> 

觸發酥料餅

<li><a href="#" rel="popover_controller_$id">Link Title</a></li> 

最後，我使用的是當前JavaScript中的鏈接（它被循環通過數據庫記錄，所以每個記錄得到以下javascript）：

$(function() { 
    $('a[rel=popover_controller_$id]').popover({ 
      placement:'right', 
      title:'Title (this is fetched from the database for each popover)', 
      content: $('#controller_popup_$id).html() 
    }); 
}); 
$(document).ready(function() { 
    // refreshing code 
    setInterval(function() { 
     $('#controller_popup_$id').hide(); // close any open popovers 
     // fetch new html 
     $('#onlinedata').load('http://website-link.com #onlinedata', function() { 
      // after load, set up new popovers 
      $('a[rel=popover_controller_$id]').popover({ 
       placement:'right', 
       title:'Title (this is fetched from the database for each popover)', 
       content: $('#controller_popup_$id').html() 
      }); 
     }); 
    }, 10000); // 10 second wait 
}); 

---

**新代碼女巫半廠**

我用下面的代碼半的作品。我遇到的唯一問題是在它重新加載#onlinedata div之後，它將彈出式鏈接放大。

$(document).ready(function() { 
     $('a[rel=popover_controller_$id]').popover({ 
      placement:'right', 
      title:'Title', 
      content: $('#controller_popup_$id').html() 
     }); 
     // refreshing code 
     setInterval(function() { 
      // fetch new html 
      $('a[rel=popover_controller_$id]').load('http://websiteurl.com/ #onlinedata', function() { 

       $('a[rel=popover_controller_$id]').popover('destroy'); // remove old popovers 
       // after load, set up new popovers 
       $('a[rel=popover_controller_$id]').popover({ 
        placement:'right', 
        title:'Title', 
        content: $('#controller_popup_$id').html() 
       }); 

      }); 
     }, 10000); // 10 second wait 
}); 

---

Answer 1

像this answer，我想你會需要插件重新申請已load -ed新的DOM元素。這實際上意味着在撥打load之後添加popover代碼的副本。如果舊的蹦蹦跳跳，你可能不得不隱藏它們。這給了我們：

$(document).ready(function() { 
    // refreshing code 
    setInterval(function() { 
     $('a[rel=popover]').popover('destroy'); // remove old popovers 
     // fetch new html 
     $('#onlinedata').load('/onlinedata.html #onlinedata', function() { 
      // after load, set up new popovers 
      $('a[rel=popover]').popover({ 
       placement:'right', 
       content: $('#div-that-contains-data').html() 
      }); 
     }); 
    }, 10000); // 10 second wait 
});