Hinzufügen eigenen Inhalts zu den Registerkarten UI auf Ereignis

Question

Ich habe einige Probleme mit dem Hinzufügen eigener Inhalte zu neuen geöffneten Registerkarte.

  add: function(event, ui) { 
      _CURRENT_TAB = $(ui.tab).attr('href'); 
      var tab_content = "TEST"; 
      $(ui.panel).append("<p>" + tab_content + "</p>"); 
      $tabs.tabs('select', '#' + ui.panel.id); 

Aber ich habe Rückruf bei Klick-Funktion:

function tb(tab_title){ 
      return '#\\#tabs'+tab_title; 
     }; 

$("#buuton").click(function(){ 
       $.post("open.php", { read: file }, 
        function(data){ 
         var read = data.read; 
         alert(read); 
         tab_content = read; 
        }, "json"); 

      $tabs.tabs("add", "#tabs-" + tab_counter, "Lorem"); 
      tab_counter++; 
      $(tb(tab_title)).append(tab_content); 
} 

ich das bin mit: http://jqueryui.com/demos/tabs/#manipulation. AJAX funktioniert - es gibt mir einen Wert, wie ich will. Was mache ich falsch? Was soll ich machen?

Answer 1

Ihr Problem besteht darin zu verstehen, wie asynchrone Transaktionen funktionieren. Wenn Sie $ .post aufrufen, wird das JavaScript weiterhin ausgeführt, bevor die POST abgeschlossen ist. Dies ist die Art von asynchronen Transaktionen. Sie rufen also im Grunde Ihre tb-Funktion auf, bevor Ihre .post-Funktion den Wert von tab_content eingestellt hat. Ihre Logik sollte in etwa so sein, dass die Funktion tb() in der .post-Handler-Funktion aufgerufen wird:

$.post("open.php", { read: file }, function(data){ 
    var read = data.read; 
    alert(read); 
    tab_content = read; 
    $tabs.tabs("add", "#tabs-" + tab_counter, "Lorem"); 
    tab_counter++; 
    $(tb()).append(tb(tab_title)); 
}, "json");