⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 index.html

📁 ajax 聊天室,实现多人聊天,无刷新!
💻 HTML
字号:
🔍 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>ajax im</title>
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/effects.js" type="text/javascript"></script>
<script src="js/window.js" type="text/javascript"></script>
<script src="js/soundmanager.js" type="text/javascript"></script>
<script src="js/md5.js" type="text/javascript"></script>
<script src="js/xhconn.js" type="text/javascript"></script>
<script src="js/json.js" type="text/javascript"></script>
<script src="js/ajax_im.js" type="text/javascript"></script>
<script src="js/initialize.js" type="text/javascript"></script>

<link href="css/default.css" rel="stylesheet" type="text/css" />
<link href="css/alphacube.css" rel="stylesheet" type="text/css" />
<link href="css/modal.css" rel="stylesheet" type="text/css" />
<link href="css/ajax_im.css" rel="stylesheet" type="text/css" />
<link href="css/windows.css" rel="stylesheet" type="text/css" />
</head>

<body onmousedown="showHide(event);">
<div>
   <!-- SoundManager Audio Div -->
</div>
<div id="modal" class="modalFrame" style="display:none;">
   <div id="loginDialog">
      <p><span class="dialog_modal_title">Sign On</span></p>

      <p><span id="login_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>

      <p><span class="dialog_label">username:</span> <span class="dialog_input"><input type="text" id="username" onkeypress="loginHandler(event);" /></span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">password:</span> <span class="dialog_input"><input type="password" id="password" onkeypress="loginHandler(event);" /></span></p>
      <div style="clear:both"></div>
      <p>
         <span class="dialog_links" onselectstart="return false;" onmousedown="return false;">
            <a href="#" onclick="login();return false;" style="margin-right: 10px;"><img src="images/modal/signon.png" id="signon_button" style="border:0" alt="Sign On" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
            <a href="#" onclick="register_dialog();return false;" style="margin-right: 10px;"><img src="images/modal/register.png" style="border:0" alt="Register" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
            <a href="#" onclick="forgot_pass_dialog();return false;"><img src="images/modal/forgot_pass.png" style="border:0" alt="Forgot Password" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
         </span>
      </p>
      <div style="clear:both"></div>
   </div>
   
   <div id="registerDialog">
      <p><span class="dialog_modal_title">Register</span></p>
      <div style="clear:both"></div>
      <p><span id="register_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">username:</span> <span class="dialog_input"><input type="text" id="newusername" /></span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">password:</span> <span class="dialog_input"><input type="password" id="newpassword" /></span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">confirm:</span> <span class="dialog_input"><input type="password" id="newpassword2" /></span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">email:</span> <span class="dialog_input"><input type="text" id="newemail" /></span></p>
      <div style="clear:both"></div>
      <p>
         <span class="dialog_links" onselectstart="return false;" onmousedown="return false;">
            <a href="#" onclick="register();return false;" style="margin-right: 10px;"><img src="images/modal/register.png" id="register_button" style="border:0" alt="Register" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
            <a href="#" onclick="login_dialog();return false;" style="margin-right: 10px;"><img src="images/modal/cancel.png" style="border:0" alt="Cancel" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
         </span>
      </p>
      <div style="clear:both"></div>
   </div>
   
   <div id="forgotPassDialog">
      <p><span class="dialog_modal_title">Password Reset</span></p>
      <div style="clear:both"></div>
      <p><span id="forgotpass_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>
      <div style="clear:both"></div>
      <p><span class="dialog_label">email address: </span> <span class="dialog_input"><input type="text" id="resetto" /></span></p>
      <div style="clear:both"></div>
      <p>
         <span class="dialog_links" onselectstart="return false;" onmousedown="return false;">
            <a href="#" onclick="resetPass();return false;" style="margin-right: 10px;"><img src="images/modal/reset.png" id="forgotpass_button" style="border:0" alt="Reset" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
            <a href="#" onclick="login_dialog();return false;" style="margin-right: 10px;"><img src="images/modal/cancel.png" style="border:0" alt="Cancel" onmouseover="buttonHover(this);" onmousedown="buttonDown(this);" onmouseout="buttonNormal(this);" onmouseup="buttonNormal(this);" /></a>
         </span>
      </p>
      <div style="clear:both"></div>
   </div>
</div>
<div class="itemList" id="statusList">
   <a href="#" onclick="setStatus(0, 'I\'m available');return false;"><img src="images/online.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;I'm available</a>
   <a href="#" style="border-bottom: 1px solid #bfbcb8;" onclick="setStatus(99, 'Friends only');return false;"><img src="images/online.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;Friends only</a>
   <a href="#" onclick="setStatus(1, 'I\'m busy');return false;"><img src="images/away.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;I'm busy</a>
   <a href="#" onclick="setStatus(1, 'I\'ll be back later');return false;"><img src="images/away.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;I'll be back later</a>
   <a href="#" onclick="setStatus(1, 'I\'m away from my computer');return false;"><img src="images/away.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;I'm away from my computer</a>
   <a href="#" id="customMessage" style="border-top: 1px solid #bfbcb8;" onclick="customAway();$('statusList').style.display='none';return false;"><img src="images/away.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;<i>Customized message...</i></a>
   <a href="#" style="border-top: 1px solid #bfbcb8;" onclick="setStatus(49, 'Invisible');return false;"><img src="images/offline.png" style="border:0;" width="16" height="16" alt="" title="" />&nbsp;&nbsp;Invisible</a>
</div>
<div class="itemList" id="fontsList">
   <a href="#" onclick="setFont('Arial');return false;">Arial</a>
   <a href="#" onclick="setFont('Comic Sans MS');return false;">Comic Sans MS</a>
   <a href="#" onclick="setFont('Courier New');return false;">Courier New</a>
   <a href="#" onclick="setFont('Garamond');return false;">Garamond</a>
   <a href="#" onclick="setFont('Georgia');return false;">Georgia</a>
   <a href="#" onclick="setFont('Impact');return false;">Impact</a>
   <a href="#" onclick="setFont('Tahoma');return false;">Tahoma</a>
   <a href="#" onclick="setFont('Times New Roman');return false;">Times New Roman</a>
   <a href="#" onclick="setFont('Verdana');return false;">Verdana</a>
</div>
<div class="itemList" id="fontSizeList" oncontextmenu="return false;">
   <a href="#" onclick="setFontSize(8);return false;">8</a>
   <a href="#" onclick="setFontSize(10);return false;">10</a>
   <a href="#" onclick="setFontSize(12);return false;">12</a>
   <a href="#" onclick="setFontSize(14);return false;">14</a>
   <a href="#" onclick="setFontSize(16);return false;">16</a>
   <a href="#" onclick="setFontSize(18);return false;">18</a>
   <a href="#" onclick="setFontSize(20);return false;">20</a>
   <a href="#" onclick="setFontSize(22);return false;">22</a>
   <a href="#" onclick="setFontSize(24);return false;">24</a>
</div>
<div class="itemList" id="emoticonList">
   <table class="tTable">
      <tr>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/smile.gif" width="19" height="19" style="border:0;" onclick="insertText(':)');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/grin.gif" width="19" height="19" style="border:0;" onclick="insertText(':D');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/wink.gif" width="19" height="19" style="border:0;" onclick="insertText(';)');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/embarassed.gif" width="19" height="19" style="border:0;" onclick="insertText(':[');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/love.gif" width="19" height="19" style="border:0;" onclick="insertText(':*');return false;" /></a></td>
      </tr>
      <tr>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/sad.gif" width="19" height="19" style="border:0;" onclick="insertText(':(');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/cry.gif" width="19" height="19" style="border:0;" onclick="insertText(':\'(');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/cool.gif" width="19" height="19" style="border:0;" onclick="insertText('8-)');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/angry.gif" width="19" height="19" style="border:0;" onclick="insertText('>:o');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/surprised.gif" width="19" height="19" style="border:0;" onclick="insertText(':O');return false;" /></a></td>
      </tr>
      <tr>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/serious.gif" width="19" height="19" style="border:0;" onclick="insertText(':|');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/sick.gif" width="19" height="19" style="border:0;" onclick="insertText(':-S');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/tongue.gif" width="19" height="19" style="border:0;" onclick="insertText(':P');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/heart.gif" width="19" height="19" style="border:0;" onclick="insertText('<3');return false;" /></a></td>
         <td><a href="#" onmousedown="return false;"><img class="emotIcon" src="images/emoticons/heartbroken.gif" width="19" height="19" style="border:0;" onclick="insertText('</3');return false;" /></a></td>
      </tr>
   </table>
</div>
<div class="itemList" id="fontColorList" style="cursor: pointer;">
   <table class="tTable">
      <tr>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#000000;" onclick="setFontColor('#000000');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#b8b8b8;" onclick="setFontColor('#b8b8b8');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#b4ad3b;" onclick="setFontColor('#b4ad3b');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#bb5c54;" onclick="setFontColor('#bb5c54');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#755a5c;" onclick="setFontColor('#755a5c');"></td>
      </tr>
      <tr>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#a9b5ef;" onclick="setFontColor('#a9b5ef');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#d65a20;" onclick="setFontColor('#d65a20');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#e39230;" onclick="setFontColor('#e39230');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#a71334;" onclick="setFontColor('#a71334');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#590099;" onclick="setFontColor('#590099');"></td>
      </tr>
      <tr>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#d40088;" onclick="setFontColor('#d40088');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#0030ac;" onclick="setFontColor('#0030ac');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#676f11;" onclick="setFontColor('#676f11');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#769321;" onclick="setFontColor('#769321');"></td>
         <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#3966fe;" onclick="setFontColor('#3966fe');"></td>
      </tr>
   </table>
</div>
<script type="text/javascript">soundManagerInit();</script>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -