Twitter Bootsrap: Popover i Auto Refresh

Question

Używam Twittera Boostrap z przeprojektowaniem strony i potrzebuję pomocy jQuery. Używam dodatku "Popover", który jest pakowany z bootstrapem i mam go w znaczniku #div (#online by być specyficznym) i używam jquery, aby przeładować div co 10 sekund. Działa to jednak dobrze, jeśli najedziesz kursorem na link aktywujący popover, gdy div odświeży się, popover utknie.

Używam tego kodu do odświeżania:

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

A jeśli potrzeba, to kod, który aktywuje popover:

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

Czy istnieje sposób, aby uniknąć popover z tkwić otworzyć po załadowaniu div?

Każda pomoc jest bardzo doceniana.

---

Associated HTML

$id jest kluczowym specyficzne dla każdego popover ponieważ mam wiele popovers.

Część popover który jest ukryty aż do popover_controller jest unosił:

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

link, który wyzwala popover

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

I wreszcie, aktualny JavaScript używam (robi pętlę poprzez rekordy bazy danych, aby każdy rekord zawierał następujący 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 
}); 

---

** nowy kod Witch Naczepy Works **

używam następujący kod, który naczepy działa. Jedyny problem, jaki mam, to po ponownym wczytaniu div #onlinedata, mnoży łącza popover.

$(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

Jak this answer, myślę, że trzeba będzie ponownie zastosować wtyczkę do nowych elementów DOM, które zostały load -ed. Oznacza to w praktyce dodanie kopii kodu popover po wywołaniu load. Jeśli stare popovers się kręcą, może będziesz musiał je ukryć. To daje nam:

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