PHP+jquery+ajax实现即时聊天功能实例

156 阅读 0 评论 103 点赞

我是靠谱客的博主柔弱金毛，最近开发中收集的这篇文章主要介绍PHP+jquery+ajax实现即时聊天功能实例，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

本文实例讲述了PHP+jquery+ajax实现即时聊天功能的方法。分享给大家供大家参考。具体如下：

这是一个简单的利用jquery与php做的一个聊天室的源码,我们这里定时利用ajax读取数据库并进行刷新了,下面直接参上源码,实例代码如下:

index.html页面如下：

复制代码代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<title>无标题文档</title> 

<script src="js/jquery-1.9.1.min.js"></script> 

<script> 

var chat = { 

 init:function(){ 

  chat.first(); 

  $('#chat_btn').unbind('click').click(function(){ 

   chat.send(); 

  }); 

  $('#my_chat').keyup(function(){ 

   if(event.keyCode == 13){ 

    chat.send(); 

   } 

  });

 }, 

 first:function(){ 

  $.getJSON('data.php',{ 

   action:'first', 

   type:'l' 

  },function(data){ 

   chat.btn_status._true(); 

   $('#mwebtime').html(data.time); 

   $('#chat textarea').val(data.chat); 

   $('#chat textarea').stop(true,true).animate({scrollTop:9999}, 1); 

   chat.socket(); 

  }); 

 }, 

 send:function(){ 

  chat.btn_status._false(); 

  $.getJSON('send.php',{ 

   txt:$('#my_chat').val(), 

   type:'l' 

  },function(data){ 

   if(data.status==200){ 

    chat.btn_status._false(); 

    $('#my_chat').val(''); 

    setTimeout(function(){ 

     chat.btn_status._true(); 

    },2000); 

   } 

  }); 

 }, 

 socket:function(){ 

  $.getJSON('data.php',{ 

   action:'while', 

   type:'l' 

  },function(data){ 

   $('#mwebtime').html(data.time); 

   $('#chat textarea').val(data.chat); 

   $('#chat textarea').stop(true,true).animate({scrollTop:9999}, 1);  

   chat.socket(); 

  }); 

 }, 

 btn_status:{ 

  _false:function(){ 

   $('#chat_btn').html('等待').attr('disabled',true); 

  }, 

  _true:function(){ 

   $('#chat_btn').html('发言').attr('disabled',false); 

  } 

 } 

} 

chat.init(); 

</script> 

</head> 

<body> 

<div id="chat"> 

 <textarea wrap="physical" style="line-height:20px;font-size:12px;height:100px;width:200px;"></textarea> 

 <BR /> 

 <input id="my_chat" type="text" /> 

 <button id="chat_btn" disabled="disabled">发言</button> 

</div> 

<div id="mwebtime"></div> 

</body> 

</html>

data.php页面如下：

复制代码代码如下:

<?php 

header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");  

header("Last-Modified: ".gmdate("D, d M Y H:i:s")." GMT");  

header("Cache-Control: no-cache, must-revalidate");  

header("Pramga: no-cache"); 

set_time_limit(0); 

$get = $_GET['action']; 

$type = $_GET['type']; 

$file = $type.'.txt'; 

if(isset($get) && isset($type) && file_exists($file)){ 

 switch($get){ 

  case 'first': 

   $chat = file_get_contents($file); 

   $json=array( 

    'status' => 200, 

    'time' => gmdate("s"), 

    'chat' => $chat, 

   ); 

   echo json_encode($json); 

   break;

  case 'while': 

   $oldsize = filesize($file); 

   $newsize = filesize($file); 

   while(true){ 

    if($oldsize!=$newsize){ 

     $chat = file_get_contents($file); 

     $json=array( 

      'status' => 200, 

      'time' => gmdate("s"), 

      'chat' => $chat, 

     ); 

     echo json_encode($json); 

     exit; 

    } 

    clearstatcache(); 

    $newsize = filesize($file); 

    usleep(10000); 

   } 

   break; 

 } 

} 

?>

send.php页面如下：

复制代码代码如下:

<?php 

$json = array(); 

$txt = isset($_GET['txt'])?$_GET['txt']:''; 

$type = isset($_GET['type'])?$_GET['type']:''; 

if($txt!=''){ 

 $file = $type.".txt"; 

 if(file_exists($file)){ 

  $fp = fopen($file,"a"); 

  $str = "rn".'Admin：'.$txt; 

  //$str = $txt."n"//linux; 

  fwrite($fp, $str); 

  fclose($fp); 

  $json['status']=200; 

  echo json_encode($json); 

  exit; 

 } 

} 

?>