Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Tooltip - nie działa po odświeżeniu div-a
Forum PHP.pl > Forum > XML, AJAX
tjakob
Witam wszystkich
zwracam się z prośbą o pomoc. Mianowicie borykam się z tooltipem w ajax-sie. Wszystko pięknie działa po załadowaniu strony lub po jej odświeżeniu np F5. Jednak w części stosuję odświeżanie div-a co 60 sek. przez ajax:
  1. <script type="text/javascript" >
  2. $.ajaxSetup({ cache: false });
  3. var auto_refresh = setInterval(
  4. function()
  5. {
  6. $('#loaddiv').load('refresh_clusterdx_2.php');
  7. }, 60000);
  8. </script>

Kod mojego tooltipa:
  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. function showProfileTooltip(e, id){
  4. var top = e.clientY -45;
  5. var left = e.clientX + 25;
  6.  
  7. $('.p-tooltip').css({
  8. 'top':top,
  9. 'left':left
  10. }).show();
  11. //send id & get info from get_profile.php
  12. $.ajax({
  13. url: '/Info/get_prefix.php?id='+id,
  14. beforeSend: function(){
  15. $('.p-tooltip').html('Loading..');
  16. },
  17. success: function(html){
  18. $('.p-tooltip').html(html);
  19. }
  20. });
  21. }
  22.  
  23. function hideProfileTooltip(){
  24. $('.p-tooltip').hide();
  25. }
  26.  
  27. $('.profile').mouseover(function(e){
  28. var id = $(this).attr('data-id');
  29. showProfileTooltip(e, id);
  30. });
  31.  
  32. $('.p-tooltip').mouseleave(function(){
  33. hideProfileTooltip();
  34. });
  35. });
  36. </script>

Wszystko, pięknie i ładnie wygląda smile.gif dopóki div nie zostaje odświeżony sad.gif radość z pojawiającej się podpowiedzi tooltipa - znika! Bardzo Was proszę o pomoc, gdzie szukać? Przewertowałem już wiele i nie mogę znaleźć rozwiązania problemu, czy jest to w ogóle możliwe do rozwiązania. Bardzo proszę o pomoc i wskazówki

Pozdrawiam
Tomek
nospor
No jesli twoj div nadpisuje element o klasie .profile to nic dziwnego ze ci tooltip nie dziala bo tooltip byl podpiery pod .profile ktore juz nie istnieje. Albo podpinaj na nowo po ajax, albo zainteresuj sie .ON
tjakob
dziękuję Nospor za odpowiedź, ale jeśli możesz, proszę wytłumacz mi bardziej "łopatologicznie"

poczytałem, zgodnie z podpowiedzią o .ON i trochę przerobiłem, ale teraz to już nawet po załadowaniu i odświeżeniu strony nie mam tooltip-a sad.gif
  1. $(document).on('mouseover', '.profile', function() {
  2. var id = $('.profile').attr('data-id');
  3. showProfileTooltip(e, id);
  4. });
  5.  
  6. $(document).on('mouseleave', '.p-tooltip', function() {
  7. hideProfileTooltip();
  8. });


kurcze, coraz bardziej to staje się niejasne dla mnie sad.gif

  1. $(document).on('mouseover', '.profile', function(e) {
  2. var id = $('.profile').attr('data-id');
  3. showProfileTooltip(e, id);
  4. });
  5.  
  6. $(document).on('mouseleave', '.p-tooltip', function() {
  7. hideProfileTooltip();
  8. });

powyższy kod działa, ale ponownie po odświeżeniu tooltip-a brak sad.gif
Dejmien_85
Wygląda w porządku, choć wewnątrz użyj "this", który odnosić będzie się do elementu:

  1. $(document).on('mouseover', '.profile', function(e) {
  2. var id = $(this).attr('data-id');
  3. showProfileTooltip(e, id);
  4. });


A po odświeżeniu na pewno masz tam atrybut data-id? Nie zginął Ci przypadkiem?

Weź sobie wciśnij F12, włącz konsolę, zobacz czy nie ma błędów jakichś, wpisz gdzieś w okolicy tego kodu "debugger;", odśwież stronę, zobacz co się dzieje gdy najedziesz myszką na ten element. Może po prostu znika ten atrybut (data-id).
tjakob
Dziękuję Wszystkim za pomoc! Dejmien_85 to było to! Zmiana na "this" i śmiga smile.gif
Pozdrawiam
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.