Тет-А-Тет чат - JavaScript, Ajax

soonner · 17.03.2011, 20:34

Хочу сделать Тет-А-Тет чатик, как сделать на ajax что бы он перегружал блок на странице и выполнял запрос к БД, брал из нее инфу и выводил.
Подскажите в каком направление думать, может ссылки на литературу или на что то подобное в готовом виде.
Заранее спасибо.

xDyPx · 17.03.2011, 23:20

мои наработки

chat.php

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link href="style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    $("#add_in_chat").submit(Send); //              ""  "Enter"
    //$("#pac_text").focus(); //      
	Load();
    setInterval("Load();", 5000);
	setInterval("online();", 5000);	//         2  (2000 )
	//setInterval("online();", 2000);
	//setInterval("scrolll();", 2000);
	}); 
function Send() {
    //       jquery ajax: $.post(, { },      )
    $.post("function.php?acc=chat_add", 
        {
         message: $("#chat_message").val()
		 },     
	 function (result) {
					eval(result);
					Load();
						}
		  ); 
    $("#chat_message").val(""); 
    return false; //    Send()  false.         ,   
}

var last_message_id = 0;
var load_in_process = false;
function Load() {
    //      .    ,      ,      .
    if(!load_in_process)
    {
			load_in_process = true;
			//  
            //   ,    javascript
            $.post("function.php?acc=chat_show",
            {
                  last: last_message_id //                            
             },
               function (result) {
					eval(result);
                    load_in_process = false; 
            });
    }
}

function online() { $.post("online.php", {}, function (result) {eval(result);});}

function add_in_mess(text) { document.getElementById("chat_message").value+=text; return false;}
</script>
</head>
<body width="100%">
<span style="margin: 0 auto;">ЧАТ:</span><hr />
    <div id="chat">
        <div id="textchat"></div>
		<div id="online">bI</div>
        <div class="sendchat">
            <form id="add_in_chat" action="function.php?acc=chat_add" method="post" enctype="multipart/form-data" name="chat_add">
            <input id="chat_message" name="message"  type="text" size="97">
            <input name="sendchat" type="submit" value="Отправить">
            </form>
			<div class="errorsendchat"></div>
        </div>
		<div class="bb_smile">:) :( %( X) :'(</div>
    </div>
</body>
</html>

function.php

Код:

<?php 
session_start();
mysql_connect('***','***','***');
mysql_select_db('***');

switch($_GET['acc'])
{
case 'chat_add':
	  $text=strip_tags(stripslashes(htmlspecialchars(trim($_POST['message']), ENT_QUOTES)));
	  $text=iconv('UTF-8', 'CP1251', $text);
	  if(!empty($text))	  mysql_query("INSERT INTO chat (text, nick, date, time) VALUES ('$text', '{$_SESSION['login']}', NOW(), time(now()) )");
	  else echo '$(".errorsendchat").fadeIn("slow").text("Нельзя отправлять пустое сообщение или введены запрещенные символы!!!").delay(3000).fadeOut("slow");';
break;
case 'chat_show':
	  mysql_query("SELECT * FROM chat ORDER BY id desc LIMIT 50");
	  $last_message_id = intval($_POST['last']);
        $query = mysql_query("SELECT * FROM chat ORDER BY id desc LIMIT 50");
        if( mysql_num_rows($query) > 0 )
        {
                $js = 'var chat = $("#textchat"); chat.empty();'; 
                $messages = array();
                while ( $row = mysql_fetch_array($query) )
                {
                        $messages[] = $row;
                }
                $messages = array_reverse($messages);
                foreach ( $messages as $value )
                {
 						$textt=chunk_split(chop($value['text']), 200, "<br>");
						$js .= "chat.prepend('<span>(".$value['time'].")<b> <a style=\" cursor: pointer;\"onClick=\"add_in_mess(\'".$value['nick']."&raquo;\')\">".$value['nick']."</a></b></font>&raquo; " . $textt . "</span>');";
				}
                echo $js;
        }
		else{echo '$("#textchat").text("Сообщений нет.");';}
break;
}
 ?>

тут могут быть проблемы с кодировкой и я о безопасности почти не заботился.

Виталий Желтяков · 18.03.2011, 00:16

Во вложение инструкция по написанию чата.

17.03.2011, 20:34	#1
soonner Пользователь Регистрация: 14.03.2009 Сообщений: 97	Тет-А-Тет чат Хочу сделать Тет-А-Тет чатик, как сделать на ajax что бы он перегружал блок на странице и выполнял запрос к БД, брал из нее инфу и выводил. Подскажите в каком направление думать, может ссылки на литературу или на что то подобное в готовом виде. Заранее спасибо.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Чат + БД	Lfybkf	БД в Delphi	0	27.02.2011 21:56
Чат	vinil	Помощь студентам	3	06.11.2010 08:13
Чат	djdron	Помощь студентам	1	04.11.2010 17:59
Чат	eldar	PHP	2	29.04.2009 00:30