Tema: Cargar contenido con ajax de jQuery con varias direciones
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 08/08/2014, 17:11
alexloving
 
Fecha de Ingreso: diciembre-2008
Mensajes: 12
Antigüedad: 16 años, 3 meses
Puntos: 0
Cargar contenido con ajax de jQuery con varias direciones
Deseo abrir de forma dinamica desde un enlase a varias direcciones, pero no logro meter la variable dentro de la funcion.
<a id="boton_cargar_anim" href="javascript:direccion('archivo1.php');">Inicio</a>
<a id="boton_cargar_anim" href="javascript:direccion('archivo2.php');">Inicio</a>
<a id="boton_cargar_anim" href="javascript:direccion('archivo3.php');">Inicio</a>
Espero me puedan ayudar, muchas gracias. He intentrado esto pero no me funciona;
Código Javascript: 
Ver original
  1. $(document).ready(function(){
  2. $('#boton_cargar_anim').click(function direccion(url) {
  3. var url=''+url+'';
  4.     $.ajax({
  5.         url: url,
  6.             success: function(data) {
  7.                 $('#div_dinamico_anim').html(data);
  8.                 $('#div_dinamico_anim div').slideDown(1000);
  9.             }
  10.         });
  11.     });
  12.     
  13. });

Aqui les dejo mi codigo completo sin modificar (index.php):
Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Cargando contenido dinamico con la funcion ajax de jQuery</title>
  6. <script type="text/javascript" src="http://www.actualidadjquery.es/ejemplos/js/jquery-1.4.2.min.js"></script>
  7. <script type="text/javascript">
  8. $(document).ready(function(){
  9. $('#boton_cargar_anim').click(function() {
  10.     $.ajax({
  11.         url: 'archivo.php',
  12.             success: function(data) {
  13.                 $('#div_dinamico_anim').html(data);
  14.                 $('#div_dinamico_anim div').slideDown(1000);
  15.             }
  16.         });
  17.     });
  18.     
  19. });
  20. </script>
  21.  
  22. </head>
  23. <body>
  24. <a id="boton_cargar_anim" href="javascript:function();">Inicio</a>
  25. <div id="div_dinamico_anim"></div>
  26. </body>
  27. </html>

archivo.php:

Código HTML: 
Ver original
  1. <div style="display:none;">
  2. Este es un contenido dinámico cargando vía AJAX<br />
  3. Este es un contenido dinámico cargando vía AJAX<br />
  4. Este es un contenido dinámico cargando vía AJAX<br />
  5. Este es un contenido dinámico cargando vía AJAX<br />
  6. Este es un contenido dinámico cargando vía AJAX<br />
  7. Este es un contenido dinámico cargando vía AJAX<br />
  8. Este es un contenido dinámico cargando vía AJAX<br />
  9. Este es un contenido dinámico cargando vía AJAX
  10. </div>