Hola todos de foros del web, tengo un chat que está hecho en php con ajax y mysql, justamente me han colaborado los usuarios de foros del web, estoy muy agradecido por su apoyo muchas gracias todos.
El chat ya esta funcionado, pero hay problema al momento de refrescar los divs : div de la sala de chat, div de lista de usuarios que están en el chat
Al comienzo todo anda bien, pero cuando empiezan a conversar varias personas se cuelga la ventana emergente o el navegador o se hace muy lento
En la sala se muestra 255 caracteres de conversación máximo
Por favor ayúdenme a solucionar este problema de que se cuelga el explorador o se pone muy lento
Aquí les paso la dirección donde está el chat, para que ustedes mismo prueben, se darán cuenta del problema.
Muchas gracias
http://www.elsitiodenegocios.com
Aquí les paso el script AJAX
Código HTML:
function objetoAjax(){
var xmlhttp=false;
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(E){
xmlhttp = false;
}
}
if(!xmlhttp && typeof XMLHttpRequest!='undefined'){
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
function ActualizarEstadoUser()
{
divContenido = document.getElementById("actualizar_estado_user");
var ajax=objetoAjax();
ajax.open("POST", "../clientes/actualizar_estado_user.php", true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send(null);
ajax.onreadystatechange=function()
{
if (ajax.readyState==4)
{
divContenido.innerHTML=ajax.responseText;
}
}
}
function enviarMensaje()
{
var usu=document.getElementById('idusuario');
var usu=usu.value;
var men=document.getElementById('texto');
var men=men.value;
ajax=objetoAjax();
ajax.open("POST", "chat.php",true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
consultaMensajes();
LimpiarCampoTexto();
}
}
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
ajax.send("usuario="+usu+"&mensaje="+men)
}
function consultaMensajes()
{
divContenido = document.getElementById('chatList');
var usu=document.getElementById('idusuario');
var nusuario=document.getElementById('nusuario');
var usu=usu.value;
var nusuario=nusuario.value;
var ajax=objetoAjax();
ajax.open("POST", "consulta.php", true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("usuario="+usu);
ajax.onreadystatechange=function()
{
if (ajax.readyState==4)
{
divContenido.innerHTML=ajax.responseText;
}
}
//cada 3 segundos consulta por nuevos mensajes
setTimeout('consultaMensajes();',3000);
}
//Actualiza el la conversación
window.onload = function (){
consultaMensajes();
ListaUserSesion();
}
function ListaUserSesion()
{
divlist_usuarios = document.getElementById('list_usuarios');
var ajax=objetoAjax();
ajax.open("POST", "lista_user_activo_sesion.php", true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("v="+1);
ajax.onreadystatechange=function()
{
if (ajax.readyState==4)
{
divlist_usuarios.innerHTML=ajax.responseText;
}
}
//cada 3 segundos consulta por nuevos mensajes
setTimeout('ListaUserSesion();',3000);
}
//Al pulsar tecla ENTER envia el mensaje
function pulsar(e)
{
var evento=e.keyCode || e.wich;
if(evento==13)
{
enviarMensaje();
//scrol();
ListaUserSesion();
return false;
}
return true;
}
function LimpiarCampoTexto()
{
var men=document.getElementById('texto');
var men=men.value="";
document.getElementById('texto').focus(); return;
}
//Control de scroll
//function scrol()
onload=function(){
//ListaUserSesion();//function para actualizar usuarios de la lista
setInterval(function(){if(window.parar)return;document.getElementById('chatList').scrollTop=document.getElementById('chatList').scrollHeight},30);
}
SCRIPT HTML Código HTML:
<body onunload="ActualizarEstadoUser()">
<div id="contenidoweb">
<div id="cabecera">
<div id="publicidad"></div>
<div id="barramenu">
<div id="logo">
<img src="../images/logo.gif" border="0" width="340" height="63" alt="El Sitio de Negocios"/>
</div>
</div>
</div>
<div style="padding-left:10px; padding-left:10px; padding-top:5px;">
<table width="800" border="0" cellspacing="0" cellpadding="0" align="center" >
<tr>
<td style="padding-left:0px; padding-top:0px;">
<div id="chatList" style="overflow:auto; width:600px; height:354px; padding-left:3px; padding-right:3px; border:2px solid; color:#CCCCCC;" onMouseOver="parar=1" onMouseOut="parar=0"><?php require_once('consulta.php');?>
</div>
<div>
<textarea name="texto" id="texto" rows="1" cols="50" style="width:608px; height:42px;" onKeyPress="pulsar(event);" class="TextoContenido"></textarea>
<input type="submit" name="Submit" value="Enviar" onClick="javascript:enviarMensaje();">
<input name="idusuario" type="hidden" id="idusuario" value="<?php echo $_SESSION['idcliente'];?>">
<input name="nusuario" type="hidden" id="nusuario" value="<?php echo $_SESSION['login'];?>">
</div>
</td>
<td valign="top" style="padding-top:0px; padding-left:1px; padding-right:0px;">
<div id="list_usuarios" style="overflow:auto; width:200px; height:354px; padding-left:3px; padding-right:3px; border:2px solid; color:#CCCCCC;"><?php require_once('lista_user_activo_sesion.php');?></div>
</td>
</tr>
</table>
<div id="actualizar_estado_user"></div>
</div>
</body>