Jquery-ui tabs ajax ()... stop tab Neuladen url, wenn Sie die tab ist neu gewählt

Ich bin mit jquery ui tabs, und im hinzufügen von Registerkarten, die dynamisch mit .tabs('hinzufügen',...). Die tabs laden einer url mit ajax. Das problem ist, dass jedesmal, wenn ich Sie auf eine andere Registerkarte, dann wieder kommen... das tab lädt die url. ich möchte die url einmal geladen.... irgendwelche Ideen?

InformationsquelleAutor der Frage Sir Lojik | 2011-02-22

13

Ich glaube, Sie suchen für die cache option (in diesem Fall false):

Ob oder nicht, um remote-cache-tabs
Inhalte, die z.B. nur einmal laden oder mit
jeden klicken Sie auf.

Beispiel:
```
$("#tabs").tabs({ cache:true });
```
Hier ist eine einfache demo. Verwenden Sie Firebug oder einem anderen tool, um sicherzustellen, dass der Inhalt nicht abgerufen werden, mehr als einmal pro Tablette: http://jsfiddle.net/andrewwhitaker/D6qkW/

InformationsquelleAutor der Antwort Andrew Whitaker
24

Bitte beachten Sie, dass die cache Eigenschaft der Registerkarten Optionen war veraltet jQueryUI 1.9 und entfernt 1.10. Finden Sie die jQueryUI 1.9 upgrade-Anleitung

Ist der empfohlene Weg, dies zu behandeln jetzt, ist die Verwendung der neuen beforeLoad Ereignis, um zu verhindern, dass der XHR-request ausgeführt werden.
```
$( "#tabs" ).tabs({
  beforeLoad: function( event, ui ) {
    if ( ui.tab.data( "loaded" ) ) {
      event.preventDefault();
      return;
    }

    ui.jqXHR.success(function() {
      ui.tab.data( "loaded", true );
    });
  }
});
```
InformationsquelleAutor der Antwort Cheekysoft
3

Schalten Sie die Zwischenspeicherung auf die Registerkarten, oder alternativ aktivieren Sie die globabl ajax cache-option in jQuery, wenn sich etwas ändert, das erfordert einen reload, dynamisch Anhängen etwas wie Mathematik.Rand() an das Ende des URL, so dass es nicht cache die nächste Last.

Aus der jQuery-Website für tab caching:
```
Code examples Initialize a tabs with the cache option specified. $( ".selector" ).tabs({ cache: true }); Get or set the cache option, after init. //getter
var cache = $( ".selector" ).tabs( "option", "cache" );
//setter
$( ".selector" ).tabs( "option", "cache", true );
```
InformationsquelleAutor der Antwort iivel
1

Verwenden Sie eine variable zu speichern, die einen booleschen Wert. Zunächst legen Sie auf false(ajax nicht geladen werden). Wenn Ihre ajax-Lasten einstellen der boolean auf true und überprüfen Sie den Wert vor jedem ajax-request.

Natürlich Sie tun müssen, würde ein wenig mehr Arbeit zu behandeln mehr als eine Registerkarte.

InformationsquelleAutor der Antwort The Muffin Man

$(function () {
        $("#tabs").tabs({
            beforeLoad: function (event, ui) {
                if (ui.tab.data("loaded")) {
                    event.preventDefault();
                    return;
                }
                ui.ajaxSettings.cache = false,
                ui.panel.html('<img src="images/prettyPhoto/dark_square/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'),
                ui.jqXHR.success(function() {
                    ui.tab.data( "loaded", true );
                }),
                ui.jqXHR.error(function () {
                    ui.panel.html(
                    "Couldn't load Data. Plz Reload Page or Try Again Later.");
                });
            }
        });
    });

InformationsquelleAutor der Antwort Touhid

Als jQuery 3.0 jqXHR.Erfolg entfernt wurde, - Lösung (modifizierter form CheekySoft oben) ist jetzt

$('#tabs').tabs({
  beforeLoad: function(event,ui){
    if(ui.tab.data("loaded")){
      event.preventDefault();
      return;
    }
  },
  load: function(event,ui){
    ui.tab.data("loaded",true);
  }
});

InformationsquelleAutor der Antwort Jeremy Jacob

Wickeln Sie Ihre AJAX-Aufrufe innerhalb einer if - Anweisung, die überprüft, ob eine frühere AJAX-call, d.h.:

var ajaxed = false

if ( ajaxed == false ) {
    //your ajax call
   $.ajax({
       type: "GET",
       url: "test.js",
       dataType: "html"
       success: function(data){
          //insert html into DOM
          ajaxed = true
       }
   });
}

InformationsquelleAutor der Antwort Moses

Fand ich die Lösung für das gleiche problem hier ist die perfekte Antwort und bitte lieber den link:

 $( "#tabs" ).tabs({
beforeLoad: function( event, ui ) {
    if ( ui.tab.data( "loaded" ) ) {
        event.preventDefault();
        return;
    }

    ui.jqXHR.success(function() {
        ui.tab.data( "loaded", true );
    });
}