*   >> Lectura Educación Artículos >> tech >> desarrollo web

jQuery AJAX aquí con ThickBox enabled

Introducción:

Este es uno de los buenos ejemplos de cómo podemos cargar un ThickBox (Ejemplo: ThickBox galerías de imágenes relacionadas, etc.,) en nuestros jQuery AJAX aquí. Por lo general, si se intenta cargar un ThickBox directamente en jQuery AJAX aquí, la funcionalidad no funcionará correctamente, con el fin de hacer que esto funcione tenemos que volver a iniciar tb_init () la función de acuerdo después de la solicitud es el éxito. Sólo echar un vistazo a continuación en la forma en que va a resolver éste

Solución:..


Re-Iniciar tb_init () una vez que la solicitud es el éxito

1tb_init ('a.thickbox, area.thickbox, input.thickbox ');


Live Preview /Descargar:

Si quieres echar un vistazo a los AJAX aquí jQuery, por favor haga clic aquí para ver la misma .

Para descargar el fragmento, haga clic aquí

Ejemplo:

A continuación se muestra un ejemplo de cómo podemos hacer esto en la práctica.

Tengo unos paneles de pestañas, en uno de los Panel de pestañas hay pocas imágenes para las que necesito ThickBox funcionalidad, que es cuando hago clic en la imagen en miniatura correspondiente debería abrir una ventana emergente con la imagen real.

jQuery Código:

12345678910111213141516171819202122232425262728293031323334353637383940414243444546var reqPageUrl = new Array (); reqPageUrl [1] = "contentpage1.html"; reqPageUrl [2] = "contentpage2.html"; reqPageUrl [3] = "contentpage3.html"; reqPageUrl [4] = "contentpage4.html"; función loadTab (id) {if (reqPageUrl [id] .

length> 0) {$ ("# preloader") show ().; $ .ajax ({url: reqPageUrl [id], caché: falsa, error:. función (XMLHttpRequest, textStatus, errorThrown) {$ ('# tabmenu a') removeClass ("activo"); //eliminar toda clase = ' activo "para todos los anclajes $ (" # content_tab "+ id) .toggleClass (" activo ");.. //Agregar clase para los actuales $ uno (" # content ") vacía () append (" Error al cargar la página, por favor consulte con el camino '); //si hay algún error en la solicitud de $ ("# preloader") ocultar (); //ocultar el preloader}, el éxito:. función (mensaje) {$ (' # tabmenu a ') removeClass (.

"activa"); //eliminar toda clase = "activa" para todas las anclas $ ("# content_tab" + id) .toggleClass ("activo"); //añadir la clase a los actuales $ uno ( "#content") vacía () append (mensaje);.. //primero vaciar el contenido, a continuación, añadir el contenido $ ("# preloader") ocultar ();. //ocultar la tb_init prel

Page   <<       [1] [2] [3] >>

Copyright © 2008 - 2016 Lectura Educación Artículos,https://lectura.nmjjxx.com All rights reserved.