2017-02-09 6 views
-2

Ich habe eine HTML-Seite #main, die von einer Javascript-Funktion vollständig geladen ist loadNe(). Nachdem die Seite vollständig vom Ajax-Aufruf geladen wurde, möchte ich einige Tooltips anzeigen, wenn ich einige Zeilen mouseovere. Diese Tooltips machen Ajax-Anfragen, ihren Inhalt anzuzeigen. Das Problem ist:jquery tooltip() php ajax Anfrage funktioniert nicht

Die "open:" - Funktion in tooltip() wird wahrscheinlich nie ausgeführt, da nichts von der console.log() in der Konsole gedruckt wird. Außerdem werden keine Netzwerkanforderungen an die AJAX-URL des Tooltips gesendet. Trotzdem funktioniert der Tooltip, wenn ich mit der Maus über die Elemente gehe, er zeigt mir den Tag-Inhalt des Titels "Loading ...".

Was kann hier schiefgehen?

function loadNe(ne){ 
     $.ajax({ 
      type: "GET", 
      url: "/NOKIA/fx-load.php?label=" + ne, 
      dataType: "text", 
      success: function (data){ 
       var content = fillResult(data); 
       $("#main").html(content).hide(); 
       $("#main").fadeIn("slow"); 
       $(".sfp").tooltip({ 
        track: true, 
        open: function (event, ui){ 
         var sfp = $(this).text(); 
         console.log("1-executing.."+sfp); 
         $.ajax({ 
          type: "GET", 
          url: "/NOKIA/sfp-load.php?sfp="+sfp, 
          dataType: "json", 
          success: function(data){ 
           console.log("2-executing.."+data["reach"]); 
           var html = "<tr><td>Alance: "+data["reach"]+"</td></tr>"+ 
              "<tr><td>Tamanho de onda: "+data["wavelength"]+"</td></tr>"+ 
              "<tr><td>Limiar Rx: "+data["rx_min"]+"</td></tr>"; 
           $(".sfp").tooltip('option','content',html); 
          } 
         });        
        } 
       }); 
      } 
     }); 
    } 

Antwort

0

Das Problem war, dass ich die bootstrap.min.js vor der js-ui.min.js geladen wurde. Die Tooltip() - Funktion führte die Bootstrap-Bibliothek anstelle von js-ui aus. So invertierte ich die Reihenfolge des Ladens, wie es hier unten ist:

<script src="bootstrap/js/bootstrap.min.js"></script> 
<script src="js-ui/jquery-ui.min.js"></script> 
Verwandte Themen