当前位置:首页 > 综合实例 > 列表

ajax php 聊天室实例代码(4)

发布:smiling 来源: PHP粉丝网  添加日期:2013-12-16 16:19:45 浏览: 评论:0 
  1. <html> 
  2. <head> 
  3.  <title>迷你php+ajax聊天室演示 <?php echo $title;?></title> 
  4.  <meta http-equiv='pragma' content='no-cache' /> 
  5.  <meta http-equiv=content-type content="text/html; charset=<?php echo $charset;?>" /> 
  6.  <meta name="keywords" content="<?php echo $lang["keywords"];?>"
  7.  <meta name="description" content="mini ajax chatroom by longbill. <?php echo $description;?>"
  8. <style type='text/css'
  9. body { text-align:center; color:#333333; font-size:12px; font-family:宋体;} 
  10. a { text-decoration:none; color:#a2b700; } 
  11. .mydiv { text-align:left; margin:5px; padding:5px; border:1px solid #ff8c05; background-color:#fdd283; width:600px; } 
  12. .inputtext { border:0px; border-bottom:1px solid #333333; background-color:transparent;} 
  13. .submit { border:1px solid #ff8c05; background-color:transparent; } 
  14. .contents { border:1px solid #ff8c05;margin:5px; margin-top:10px;background-color:#ffffff; overflow:auto;word-break:break-all;word-wrap :break-word;} 
  15. .bg { background-color:#ffffff; } 
  16. .content { border:0px;background-color:transparent;width:auto; font-size:16px; font-family:fixedsys; margin:2px; padding:1px; } 
  17. .time { color:#aaaaaa; font-size:10px; font-family:arial;} 
  18. .online { margin:5px; padding:0px; display:inline; } 
  19. .mybut { width:20px; height:20px; background-color:#ff8c05; text-align:center; font-size:18px; color: #333333;} 
  20. </style> 
  21. <script> 
  22. function $(obj) 
  23.  return document.getelementbyid(obj); 
  24. function setcookie(name,value,t) 
  25.  var cookieexp = 5*30*24*60*60*1000; //5 months 
  26.  var cookiestr=name+"="+escape(value)+";"
  27.  var expires = ""
  28.  var d = new date(); 
  29.  var t2=(!t)?cookieexp:t*60*1000; 
  30.  d.settime( d.gettime() + cookieexp); 
  31.  expires = "expires=" + d.togmtstring()+";"
  32.  document.cookie = cookiestr+ expires; 
  33. function getcookie(name) 
  34.  var start = document.cookie.indexof( name + "=" ); 
  35.  var len = start + name.length + 1; 
  36.  if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) ) return ""
  37.  if ( start == -1 ) return ""
  38.  var end = document.cookie.indexof( ";", len ); 
  39.  if ( end == -1 ) end = document.cookie.length; 
  40.  return unescape( document.cookie.substring( len, end ) ); 
  41. function createajax() 
  42.  if (window.xmlhttprequest)  
  43.  { 
  44.   var ohttp = new xmlhttprequest(); 
  45.   return ohttp; 
  46.  }  
  47.  else if (window.activexobject)  
  48.  { 
  49.   var versions = [ 
  50.    "msxml2.xmlhttp.6.0"
  51.    "msxml2.xmlhttp.3.0" 
  52.   ]; 
  53.   for (var i = 0; i < versions.length; i++)  
  54.   { 
  55.    try { 
  56.     var ohttp = new activexobject(versions[i]); 
  57.     return ohttp; 
  58.    } catch (error) {} 
  59.   } 
  60.      } 
  61.  throw new error("your browser doesn't support xmlhttprequest"); 
  62. function pickcolor() 
  63.  if (!window.isie) return
  64.  var scolor = $('dlghelper').choosecolordlg(); 
  65.  var color = scolor.tostring(16); 
  66.  while (color.length<6) color="0"+color; 
  67.  window.color = color; 
  68.  color = "#"+color; 
  69.  $('div_color').style.backgroundcolor = color; 
  70.  $('div_color').value = color; 
  71. var isie = (document.all && window.activexobject) ? true : false; 
  72. </script> 
  73. </head> 
  74. <body > 
  75. <center> 
  76. <div class=mydiv style='text-align:center; border:0px; background-color:transparent; font-size:25px; color:#ff8c05;'><?php echo $title;?></div> 
  77. <div class="mydiv login" id='div_description'
  78. <?php echo $description;?> 
  79. </div> 
  80. <div class="mydiv rooms" id='div_msg'
  81. <div class='contents' style='height:350px;' id='div_contents'>loading...</div> 
  82. </div> 
  83. <div class="mydiv login" id='div_name' style='display:block;'
  84. name:<input type=text class="inputtext bg" size=8 id='chat_user' value='' maxlength=30 />&nbsp; 
  85. <object id=dlghelper classid="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0px" height="0px"></object> 
  86. <input class="inputtext" style='width:50px;cursor:hand;10px;background-color:#000000;color:#ffffff;' id='div_color' onclick="pickcolor()" value="#000000" onblur="this.style.backgroundcolor=this.value;window.color=this.value.replace('#','');" /> 
  87. &nbsp;size:<input class="inputtext bg" type=text style='width:20px' maxlength=3 id='input_size' value='16' />(px) 
  88. &nbsp;font:<select id='input_font' class='inputtext bg' style='width:70px;'
  89. <option value='fixedsys'>fixedsys</option> 
  90. <option value='heiti'>黑体</option> 
  91. <option value='songti'>宋体</option> 
  92. <option value='kaiti'>楷体</option> 
  93. </select> 
  94. bold:<input type=checkbox id='input_bold' class='inputtext' style='border-bottom:0px;' /> 
  95. window:<a class='mybut' href='#' onclick='resize(1)'>+</a> 
  96. &nbsp;<a class='mybut' href='#' onclick='resize(0)'>-</a> 
  97. &nbsp;<a class='mybut' style='width:25px;font-size:16px;' href='#' onclick='clearall()'>clear</a> 
  98. </div> 
  99. <div class="mydiv login" id='div_word'
  100. <textarea type=text class="inputtext bg" rows=1 scrolling=no style='height:20px;overflow:hidden;width:500px;' id='chat_word' onfocus="if (this.value == '<?php echo $lang["hereyourwords"];?>') this.value=''; window.editing=0; "  
  101.  onkeydown="return check_send(event);" ><?php echo $lang["hereyourwords"];?></textarea> 
  102. <input type=button class=submit value='send' onclick="chat_send();$('chat_word').style.height=20;" onfocus="this.blur();"/> 
  103. </div> 
  104. <div class='mydiv' style='display:<?php if (!$disonline) echo "none";?>' id='div_online'>loading online...</div> 
  105. <script> 
  106. var debug = 0; 
  107. var lastmod = <?php echo time()-$earlier*60;?>; 
  108. var login = 1; 
  109. var loading = false; 
  110. var olduser = getcookie('chatusername'); 
  111. if (olduser != "") $('chat_user').value = olduser; 
  112. var room = "<?php echo $room;?>"
  113. var first = 1; 
  114. var dis = "<?php echo $least;?>"
  115. var lastword; 
  116. var color=''
  117. var touchs = <?php echo $touchs;?>; 
  118. var dotouch = true; 
  119. var maxdisplay = <?php echo $maxdisplay;?>; 
  120. var nowdisplay = 1; 
  121. var sending = 0; 
  122. var loaded_lines = []; 
  123. var editing = 0; 
  124. function encode(s) 
  125.  return  (encodeuricomponent)? encodeuricomponent(s):s; 
  126. $('chat_user').onfocus = setonfocus; 
  127. $('input_size').onfocus = setonfocus; 
  128. function setonfocus() 
  129.  window.editing = 1; 
  130. function setonblur() 
  131.  window.editing = 0; 
  132. var keep_ajax; 
  133. function keeponline() 
  134.  var name = $('chat_user').value; 
  135.  if (!name) return
  136.  keep_ajax = createajax(); 
  137.  keep_ajax.open('post','<?php echo basename(__file__);?>',1); 
  138.  keep_ajax.setrequestheader("content-type""application/x-www-form-urlencoded"); 
  139.   
  140.  keep_ajax.onreadystatechange = function () 
  141.  { 
  142.   if (keep_ajax.readystate == 4 && keep_ajax.status == 200) 
  143.   { 
  144.    //alert(keep_ajax.responsetext); 
  145.   } 
  146.  } 
  147.  keep_ajax.send("action=keep&name="+encode(name)); 
  148. setinterval("keeponline()",touchs*1000); 
  149. function quitroom() 
  150.  if(confirm("你真的要离开聊天室吗?")) 
  151.  { 
  152.   var ajax = createajax(); 
  153.   ajax.open('post','<?php echo basename(__file__);?>',0); 
  154.   ajax.setrequestheader("content-type""application/x-www-form-urlencoded"); 
  155.   ajax.send("action=quit&name="+encode($('chat_user').value)); 
  156.   //alert("sending close  action=quit&name="+encode($('chat_user').value)); 
  157.   //alert("response:"+ajax.responsetext); 
  158.  } 
  159.  else return ''
  160. document.body.onbeforeunload =  quitroom; 
  161. setinterval(" load_word()",(debug)?6000:1000); 
  162. var load_word_ajax; 
  163. //下载完成后的处理函数 
  164. function load_word_change() 
  165.  if (load_word_ajax.readystate == 4) 
  166.  { 
  167.   if (load_word_ajax.status != 200) 
  168.   { 
  169.    load_word_error(); 
  170.    return
  171.   } 
  172.   window.loading = false; 
  173.   var body = $('div_contents');  
  174.   try { 
  175.    if (debug) alert(load_word_ajax.responsetext); 
  176.    eval("var arr = "+load_word_ajax.responsetext);  
  177.   } catch(e) 
  178.   { 
  179.    alert('error 101njson syntax error!nn'+load_word_ajax.responsetext); 
  180.    return
  181.   } 
  182.   if (!arr || !arr.lastmod || typeof(arr.lastmod) == "undefined" ) 
  183.   { 
  184.    return
  185.   } 
  186.   var html = ""
  187.   var line = arr.lines; 
  188.   var i = 0; 
  189.   var v1 = 0; 
  190.   var div_online = $('div_online'); 
  191.   if (window.first) 
  192.   { 
  193.    body.innerhtml = ""
  194.    window.first = false; 
  195.   } 
  196.    
  197.   if (arr.onlines) 
  198.   { 
  199.    $('div_online').innerhtml = ""
  200.    for(var i=0;i<arr.onlines.length;i++) addonline(arr.onlines[i]); 
  201.   } 
  202.   for(var i=0;i<line.length;i++) 
  203.   { 
  204.    var linekey = line[i].word.substring(line[i].word.length-20,line[i].word.length)+line[i].time; 
  205.    if (window.loaded_lines[linekey] === true) 
  206.    { 
  207.     if (debug) alert("jump:"+linekey); 
  208.     continue
  209.    } 
  210.    var div1 = document.createelement("div"); 
  211.    window.nowdisplay ++; 
  212.    if (window.nowdisplay > window.maxdisplay) window.nowdisplay = 1; 
  213.    if ($("contentitem"+window.nowdisplay)) body.removechild($("contentitem"+window.nowdisplay)); 
  214.    div1.classname = "content"
  215.    div1.id = "contentitem"+window.nowdisplay; 
  216.    div1.innerhtml = line[i].word+" <span class='time'>("+line[i].time+")</span>"
  217.    body.appendchild(div1); 
  218.     
  219.    window.loaded_lines[linekey] = true; 
  220.    body.scrolltop = 655350; 
  221.    v1 = 1; 
  222.   }  
  223.   if (v1)  
  224.   { 
  225.    window.focus();  
  226.    document.body.focus(); 
  227.    window.lastmod = arr.lastmod; 
  228.    if(debug) alert("lastmod = "+arr.lastmod + " nwindow.lastmod="+window.lastmod); 
  229.    if ($('chat_word').disabled == false && window.editing != 1) 
  230.    { 
  231.     $('chat_word').focus(); 
  232.    } 
  233.   } 
  234.  } 
  235. function load_word_error() 
  236.  window.loading = false; 
  237.  window.status = 'error 102:while loading words'
  238.  settimeout("window.status = '';",5000); 
  239. function load_word() 
  240.  load_word_ajax = createajax(); 
  241.  if (window.loading) 
  242.  { 
  243.   try 
  244.   { 
  245.    load_word_ajax.abort(); 
  246.    window.loading = false; 
  247.   }catch(e) {} 
  248.  } 
  249.  if (!window.lastmod) 
  250.  { 
  251.   alert("window.lastmod="+window.lastmod); 
  252.   return
  253.  } 
  254.   
  255.  load_word_ajax.open('post','<?php echo basename(__file__);?>',true); 
  256.  load_word_ajax.onreadystatechange = load_word_change; 
  257.   
  258.  var urlstring = ''
  259.  urlstring += "lastmod="+window.lastmod; 
  260.  urlstring+= "&room="+room; 
  261.  urlstring+= "&action=read"
  262.  urlstring+= "&name="+encode($('chat_user').value); 
  263.   
  264.  if (window.first) 
  265.  { 
  266.   urlstring+= "&first=true"
  267.   urlstring += "&dis="+dis; 
  268.  } 
  269.  //如果到了取得在线用户的时间 
  270.  if (window.dotouch)  
  271.  { 
  272.   urlstring+= "&touchme=true"
  273.   window.dotouch = false; 
  274.   //垃圾内存回收 
  275.   try { collectgarbage(); } catch(e) {} 
  276.  } 
  277.  window.loading = true; 
  278.  if (debug) alert("sending:"+urlstring); 
  279.  load_word_ajax.setrequestheader("content-type""application/x-www-form-urlencoded"); 
  280.   
  281.  load_word_ajax.send(urlstring); 
  282. function touchme() 
  283.  window.dotouch = true; 
  284.  settimeout("touchme()",window.touchs*1000); 
  285. function showalert(a,n) 
  286.  if (!n) n=0; 
  287.  if (n>3) return
  288.  if (!a) 
  289.  { 
  290.   a = 0; 
  291.   b = 1; 
  292.  } 
  293.  else 
  294.  { 
  295.   a = 1; 
  296.   b = 0; 
  297.  } 
  298.  document.title = mytitle[a]; 
  299.  settimeout("showalert("+b+","+(n+1)+");",500); 

Tags: ajax 聊天室 实例

分享到: