02/02/2010, 02:00
|
| | Fecha de Ingreso: junio-2009
Mensajes: 9
Antigüedad: 15 años, 6 meses Puntos: 1 | |
Ajax con archivos externos js: Llantos y quebrantos Hola a todos:
Gracias a los que haceis posible que me entere de que va la vaina esta del ajax.
Tan contento estaba que me dije, voy a integrar esta tecnología en mis proyectos, y, como el cántaro de la lechera (cuyo cántaro se rompe al final) me dedico a actualizar un div desde ajax.
Estupendo, la cosa funciona:
HTML:
<li><a href="javascript:llamarasincrono('contenidos/yomismo.htm', 'conttotal');" onfocus="this.blur()"><span>Yomismo</span></a></li>
JavaScript:
// Esta función cargará las paginas
function llamarasincrono (url, id_contenedor)
{
var pagina_requerida = false;
if (window.XMLHttpRequest){
// Si es Mozilla, Safari etc
pagina_requerida = new XMLHttpRequest ();
}
else if (window.ActiveXObject){
// pero si es IE
try {
pagina_requerida = new ActiveXObject ("Msxml2.XMLHTTP");
}
catch (e){
// en caso que sea una versión antigua
try{
pagina_requerida = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e){}
}
}
else
return false;
pagina_requerida.onreadystatechange = function (){
// función de respuesta
cargarpagina (pagina_requerida, id_contenedor);
}
pagina_requerida.open ('GET', url, true); // asignamos los métodos open y send
pagina_requerida.send (null);
}
// todo es correcto y ha llegado el momento de poner la información requerida
// en su sitio en la pagina xhtml
function cargarpagina (pagina_requerida, id_contenedor){
if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1))
var scs=pagina_requerida.responseText.extractScript();
document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText;
scs.evalScript();
}
Siguiendo las intrucciones de Maborack (alabado sea), en el foro mismo.
Más de repente me digo, ¿ por qué no utilizar un bonito efecto de presentación de fotografias? (la página versa sobre arte), e incluyo las librerías visuallightbox.js, scriptaculous.js, prototype.js, (js externos) para realizar un bonito efecto por superposición de capas que me recomendó un amigo y que funciona muy bien para html.
Pero cargando con ajax el archivo yomismo.htm, (ya sabeis para refrescar un div sin refrescar la página):
<div id="vlightbox">
<a rel="lightbox_vlb" href="data/images/14b3.jpg" onfocus="this.blur()" title="14B3"><img src="data/thumbnails/14b3.png"></a>
<a rel="lightbox_vlb" href="data/images/14b4.jpg" onfocus="this.blur()" title="14B4"><img src="data/thumbnails/14b4.png"></a>
<a rel="lightbox_vlb" href="data/images/14b7.jpg" onfocus="this.blur()" title="14B7"><img src="data/thumbnails/14b7.png"></a>
<a rel="lightbox_vlb" href="data/images/14b8.jpg" onfocus="this.blur()" title="14B8"><img src="data/thumbnails/14b8.png"></a>
<a rel="lightbox_vlb" href="data/images/14ba.jpg" onfocus="this.blur()" title="14BA"><img src="data/thumbnails/14ba.png"></a>
<a rel="lightbox_vlb" href="data/images/14bb.jpg" onfocus="this.blur()" title="14BB"><img src="data/thumbnails/14bb.png"></a>
<a rel="lightbox_vlb" href="data/images/14bc.jpg" onfocus="this.blur()" title="14BC"><img src="data/thumbnails/14bc.png"></a>
<a rel="lightbox_vlb" href="data/images/14bd.jpg" onfocus="this.blur()" title="14BD"><img src="data/thumbnails/14bd.png"></a>
<a rel="lightbox_vlb" href="data/images/14c0.jpg" onfocus="this.blur()" title="14C0"><img src="data/thumbnails/14c0.png"></a>
<a rel="lightbox_vlb" href="data/images/14c2.jpg" onfocus="this.blur()" title="14C2"><img src="data/thumbnails/14c2.png"></a>
</div>
Y con los códigos anteriores, no me funciona el bonito efecto (aunque si me carga el css), con lo cual la página carga ferpectamente, pero no consigo cargar el java. (... y ejecutar el bonito efecto)
Y la pregunta es ¿Algún alma caritativa podría iluminarme en este momento de desasosiego?. Unicamente me queda el tema este para rematar la página (en local).
Agradecido de antemano para todos aquellos que lean o respondan a este post.(espero que sirva a más gente)
Un saludo |