16/04/2012, 20:42
|
| | Fecha de Ingreso: noviembre-2011
Mensajes: 10
Antigüedad: 13 años Puntos: 0 | |
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*/ |