Dette er en av de godt eksempel på hvordan vi kan legge en ThickBox (Eksempel: ThickBox relatert bildegallerier etc.) i våre jQuery AJAX Tabs. Vanligvis, hvis du prøver å laste en ThickBox direkte inn jQuery AJAX Tabs, funksjonaliteten vil ikke fungere ordentlig, for å gjøre dette arbeidet må vi sette i gang tb_init () -funksjonen tilsvar etter at forespørselen er suksess. Bare ha et blikk nedenfor om hvordan vi skal løse dette en
Re-Start tb_init () en gang forespørselen er suksess
1tb_init ('a.thickbox, area.
thickbox, input.thickbox ');
Hvis du ønsker å ta en titt på jQuery AJAX Tabs, kan du klikke her for å vise den samme .
For å laste ned tekstutdrag, klikk her
Nedenfor er et eksempel på hvordan vi kan gjøre dette i praksis. Jeg har få Tab paneler, i en av de Tab Panel er det få bilder som jeg trenger ThickBox funksjonalitet, det er når jeg klikker på den respektive miniatyrbilde det bør åpne opp en popup med selve bildet.
12345678910111213141516171819202122232425262728293031323334353637383940414243444546var reqPageUrl = new Array (); reqPageUrl [1] = "contentpage1.html"; reqPageUrl [2] = "contentpage2.html"; reqPageUrl [3] = "contentpage3.html"; reqPageUrl [4] = "contentpage4.html"; funksjon loadTab (id) {if (reqPageUrl [id] .length> 0) {$ ("# preloader") viser (.); $ .ajax ({url: reqPageUrl [id], cache: falsk, feil. funksjon (XMLHttpRequest, textStatus, errorThrown) {$ ('# tabmenu en') removeClass ("aktiv"); //fjerne all class = ' aktiv "for alle ankere $ (" # content_tab "+ id) .
toggleClass ('aktiv');.. //legge klassen til den nåværende $ (" # innhold ") tom () føyer ('Feil Laster siden, Vennligst sjekk med banen '); //hvis det er noen feil i forespørselen $ ("# preloader") skjule (); //skjule preloader} suksess. funksjon (melding) {$ (' # tabmenu en ') removeClass (.' aktiv '); //fjerne all class = "aktivt" for alle ankere $ ("# content_tab" + id) .toggleClass ("aktiv"); //legge klassen til den nåværende $ ( "#content") tom () føyer (melding);.. //først tømme innholdet, og deretter legge til innhold $ ("# preloader") skjule ();. //skjule preloader tb_init ('a.
thickbox, område .thickbox, input.thickbox '); //kaller tb_init funksjon for å initiere ThichBox inn dine respektive kategorien paneler}}); }} $ (Document) .ready (function () {loadTab
(2); //Etter lasting, active tab 1