Foros del Web » Programando para Internet » Jquery »

no respeta el jquery cuando meto ajax :(

Estas en el tema de no respeta el jquery cuando meto ajax :( en el foro de Jquery en Foros del Web. Hola de antemano gracias, bueno mi problema es el siguiente, hice una web el cual tiene una seccion de comentarios sencillo y quise meterle ajax ...
  #1 (permalink)  
Antiguo 16/04/2012, 20:42
 
Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 12 años, 3 meses
Puntos: 0
Pregunta no respeta el jquery cuando meto ajax :(

Hola de antemano gracias, bueno mi problema es el siguiente, hice una web el cual tiene una seccion de comentarios sencillo y quise meterle ajax para que esta se actualice sola en un determinado tiempo y cargue los comentarios nuevos. sin ajax la pagina funciona correctamente, pero cuando le meto ajax funcionan los efectos que le meti con jquery, simplemente no funciona y se descuadra la pagina por que pagina tiene esos efectos para que sea bien. bueno aqui pondre el codido

--------------------------------------------------------------------------------------------------------


<!DOCTYPE html>
<html >
<head>
<title>Manuales y Tutoriales Pro --Foro--</title>
<link href="Imagenes/logo.jpg" type="image/x-icon" rel="shortcut icon"/>
<link rel="stylesheet" type="text/css" media="screen" href="Css/estilo foro.css"/>
<script language="javascript" type="text/javascript" src="Jquery/jquery-1.7.2.js"></script>
<script language="javascript" type="text/javascript" src="Jquery/usuario.js"></script>
<script language="javascript" type="text/javascript" src="Jquery/carga.js"></script>

</head>
<body>
<?php
session_start();
?>
<section id="todo">
<header id="banner">
<p class="truco">.</p><p class="truco">.</p><p class="truco">.</p><p class="truco">.</p><p class="truco">.</p><p class="truco">.</p><p class="truco">.</p><p class="truco">.</p>
<img alt="banner" src="Imagenes/pro1.jpg"/>
<img alt="banner" src="Imagenes/pro2.jpg"/>
<img alt="banner" src="Imagenes/pro3.jpg"/>
</header>
<section class="separador">
</section>
<section id="barra_navegador">
<nav id="links">
<section id="lista">
<ul>
<li><a href="principal.php">Inicio</a></li>
<li id="sub">Categorias</li>
<li><a href="video.php">Video Tutoriales</a></li>
<li><a href="foro.php">Foro</a></li>
</ul>
</section>
</nav>
<section id="sub_menu">
<section id="informacion_submenu">
<h3>Temas de interes</h3>
<p>Aqui encontraras varios temas de interes, para ampliar el conocimiento</p>
</section>
<section id="indice_submenu">
<h3>Categorias</h3>
<ul>
<li><a href="programacion web.php">Manuales Programacion Web</a></li>
<li><a href="programacion.php">Manuales de Programacion</a></li>
<li><a href="#">Informatica en gral.</a></li>
<li><a href="#">Otros temas</a></li>
</ul>
</section>
</section>
</section>
<section class="separador">
</section>
<section id="centro">
<section id="izquierda">
<section class="informacion" id="informacion">
<p class="titulos">Bienvenido a la seccion de Foro</p>
<p>Por que a nosotros nos interesas, hemos hecho esta seccion en donde podras dejar tus comentarios, sugerencias, inquietudes y demas...

</p>
</section>
<section class="separador">
</section>
<section id="imagen_dia">
<img class="imagenes_info" src="Imagenes/foro.jpg"/>
</section>
<section class="informacion" id="informacion_del_dia">

</section>
<section class="separador">
</section>
<section class="foro">
<form name="formu_coment" method="post" action="comentar.php" onsubmit= "return validar_comentario()">
<table>
<tr>
<td>Usuario:</td><?php echo '<td name="usuario_registrado">'.$_SESSION["sesion_usuario"].'</td>'?>
</tr>
<tr>
<td name="asunto">Asunto:</td><td><input class="formulario" name="asunto2" type="text"/></td>
</tr>
<tr>
<td name="comentario">Comentario:</td><td><textarea class="comen" name="area" onClick=limpia()>Deja tu comentario...</textarea></td>
</tr>
<tr>
<td></td><td><input class="boton_comen" id="publi" type="submit" value="Publicar"/><input class="boton_comen" id="can" type="reset" value="Limpiar"/></td>
</tr>
</table>
</form>
</section>
<section id="3" class="separador">
</section>
<section class="comentarios_hechos" id="bloque">
<h3 class="con_usua">Comentarios de usuarios</h3>

<?php
readfile("com.html");
?>
</section>



</section>
<section id="barra_derecha">
<section class="sesion_usuario">
<?php
if (isset($_SESSION["sesion_usuario"])) {
echo '<p>Bienvenido: ' .$_SESSION["sesion_usuario"].' </p>';
echo'<a href="cerrar sesion.php">Cerrar sesion</a>';
}
?>
</section>


</section>
</section>
<section id="3" class="separador">
</section>

<section id="abajo">
<footer id="redes_sociales">
<section id="redes">
<h3>Tambien siguenos en:</h3>
<a href=""><img id="twitter" alt="twitter" src="Imagenes/twitter.png"/></a>
<a href=""><img id="facebook" alt="facebook" src="Imagenes/facebook.png"/></a>
</section>
<section id="recomendacion">
<h3>Recomendaciones:</h3>
<ul>
<li><a class="links" href="http://www.desarrolloweb.com/">Desarrollo Web</a></li>
<li><a class="links" href="http://www.maestrosdelweb.com/">Los maestros del Web</a></li>
</ul>
</section>
</footer>
<section id="nosotros">
<section id="derechos">
<a class="links" href="acerca.php">Acerca de | </a>
<a class="links" href="contacto.php">Contacto</a>
</section>
</section>
</section>
</section>
</body>
</html>

/*Este es el archivo foro.php*/


Y este es el codigo ajax


function crearAJAX()
{
try
{
var AJAX = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
try
{
var AJAX = new XMLHttpRequest();
}
catch (e)
{
alert("El navegador que estas usando no soporta AJAX.\nPor favor, descarga uno mas moderno");
return false;
}
}
return AJAX;
}

// ########################## Tiempo Real (magia) ##################################
var ajax;
var actualizaciones = 0;
function mantener_actualizado()
{
// Crear una conexion nueva
ajax = crearAJAX();
// Procesar los cambios de estado
ajax.onreadystatechange = function()
{
if (ajax.readyState == 4)
{
// Aca esta la magia de nuevo
if (ajax.status == 200)
{
// Si el archivo existe procesamos los cambios
hay_cambios(ajax.responseText);
}
else
{
// Sino esperamos 300 milisegundos y actualizamos nuevamente
setTimeout("mantener_actualizado()", 20000);
}
}
}
ajax.open('GET','foro.php', true);
ajax.send(null);
}
window.onload = function()
{
// Crear al AJAX
ajax = crearAJAX();
// Procesar los cambios en la conexion
ajax.onreadystatechange = function()
{
if (ajax.readyState == 4)
{
// Aca esta la magia
if (ajax.status == 200)
{
// Si el archivo existe significa que hay cambios
// Obtenemos los cambios con responseText
hay_cambios(ajax.responseText);
}
else
{
// Si todavia no hay cambios esperamos un momento y actualizamos
// Si o si hay que esperar al menos 300 milisegundos, no se por que
setTimeout("mantener_actualizado()", 20000);
}
}
}
// Abrimos el archivo que nos dira si hay cambios o no
ajax.open('GET','foro.php', true);
ajax.send(null);
// y... volvemos
return;
}
function hay_cambios(texto)
{
// Creamos una conexion nueva
ajax = crearAJAX();
// Hay que cambiar la direccion que se carga
// para avisar que ya sabemos que hubo cambios
ajax.onreadystatechange = function()
{
if (ajax.readyState == 4 && ajax.status == 200)
{
// Cuando ya se borro el archivo ajax/sin_cambios.txt volvemos a actualizar
setTimeout("mantener_actualizado()", 20000);
}
}
// Aca abrimos una URL diferente
// Este archivo que abrimos borra el ajax/sin_cambios.txt para "avisar" que ya mostramos los cambios
ajax.open('GET','foro.php', true);
ajax.send(null);
// No pasa nada despues se va a ejecutar mantener_actualizado()
// y volvera a verificar cambios ;)
// Modificamos el titulo y el contenido de la pagina
document.title = 'Manuales (1)';
document.body.innerHTML = texto;
// Despues de 3 segundos vuelve a cambiar el titulo por el inicial
setTimeout(function(){
document.title = 'Manuales y Tutoriales Pro --Foro--';
}, 3000);
// ...y eso es todo
return;
}

/*Este es el archivo carga.js*/
  #2 (permalink)  
Antiguo 16/04/2012, 21:33
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 17 años, 4 meses
Puntos: 23
Respuesta: no respeta el jquery cuando meto ajax :(

Ya con ver esto me asusté

Código Javascript:
Ver original
  1. function crearAJAX()
  2. {
  3. try
  4. {
  5. var AJAX = new ActiveXObject("Microsoft.XMLHTTP");
  6. }
  7. catch (e)
  8. {
  9. try
  10. {
  11. var AJAX = new XMLHttpRequest();
  12. }
  13. catch (e)
  14. {
  15. alert("El navegador que estas usando no soporta AJAX.\nPor favor, descarga uno mas moderno");
  16. return false;
  17. }
  18. }
  19. return AJAX;
  20. }

Hay algo que se llama Jquery, que posee un metodo load() que te simplificaria muchisimo, pero muchisimo las cosas!

http://api.jquery.com/load/


Saludos
  #3 (permalink)  
Antiguo 16/04/2012, 21:37
 
Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 12 años, 3 meses
Puntos: 0
Pregunta Respuesta: no respeta el jquery cuando meto ajax :(

Cita:
Iniciado por McBlink Ver Mensaje
Ya con ver esto me asusté

Código Javascript:
Ver original
  1. function crearAJAX()
  2. {
  3. try
  4. {
  5. var AJAX = new ActiveXObject("Microsoft.XMLHTTP");
  6. }
  7. catch (e)
  8. {
  9. try
  10. {
  11. var AJAX = new XMLHttpRequest();
  12. }
  13. catch (e)
  14. {
  15. alert("El navegador que estas usando no soporta AJAX.\nPor favor, descarga uno mas moderno");
  16. return false;
  17. }
  18. }
  19. return AJAX;
  20. }

Hay algo que se llama Jquery, que posee un metodo load() que te simplificaria muchisimo, pero muchisimo las cosas!

[URL="http://api.jquery.com/load/"]http://api.jquery.com/load/[/URL]


Saludos

probare haber que si sale bien, pero si hay una ayuda extra por favor de publicarla de antemano gracias
  #4 (permalink)  
Antiguo 16/04/2012, 21:40
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 17 años, 4 meses
Puntos: 23
Respuesta: no respeta el jquery cuando meto ajax :(

Sinceramente, no lei todo el código.
pero se me ocurre que un problema puede ser que al refrescar los comentarios, estas cargando la pagina entera con los comentarios: html head body etc.

Eso puede causar que se te "descontrole" todo.

Saludos
  #5 (permalink)  
Antiguo 16/04/2012, 21:46
 
Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 12 años, 3 meses
Puntos: 0
Respuesta: no respeta el jquery cuando meto ajax :(

Ya probe algunas soluciones con jquery .load() pero aun asi no sale :(
  #6 (permalink)  
Antiguo 16/04/2012, 22:22
 
Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 12 años, 3 meses
Puntos: 0
Respuesta: no respeta el jquery cuando meto ajax :(

Cita:
Iniciado por McBlink Ver Mensaje
Sinceramente, no lei todo el código.
pero se me ocurre que un problema puede ser que al refrescar los comentarios, estas cargando la pagina entera con los comentarios: html head body etc.

Eso puede causar que se te "descontrole" todo.

Saludos
  #7 (permalink)  
Antiguo 17/04/2012, 22:39
 
Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 12 años, 3 meses
Puntos: 0
Respuesta: no respeta el jquery cuando meto ajax :(

Ya intente y no me sale, sigue sin respetar a jquery, por favor necesito ayuda :( gracias de antemano
  #8 (permalink)  
Antiguo 17/04/2012, 22:44
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 17 años, 4 meses
Puntos: 23
Respuesta: no respeta el jquery cuando meto ajax :(

Te dejo un ejemplo simple de como implementar el metodo load() de JQuery. Luego, es cuestion de cambiarlo por tu script que muestra los comentarios:

Código Javascript:
Ver original
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2.  
  3. $('#contenedor').load('mostrar_comentarios.php');

Código HTML:
Ver original
  1. <div id="contenedor"></div>



Saludos

PD: Coloca el codigo javascript al final de la pagina o incluye el load() dentro del metodo ready() de JQuery.

Etiquetas: ajax, ajax-jquery, conflicto, incompatibilidad, jquery-ajax, necesito-porfavor, problema_
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:45.