jQuery aJax技术以及PHP实现简单聊天室

最近学习了jQuery，主要包括jQuery库的使用和jQuery操作DOM、jQuery动画、事件，aJax等等，后面实现了一个简单聊天室，后面一步步介绍。推荐大家两本书《锋利的jQuery》和《jQuery权威指南》，前面一本挺适合初学者，挺容易理解的。

环境搭建

首先是服务器的搭建，这里采用的是集Apache，PHP，MySQL于一体的工具包AppServ。首先下载AppServ，AppServ下载地址
AppServ的安装也很简单，一直点”Next”按钮，输入网址，电子邮箱，密码等信息就可以，这个密码要记着，是后面连接数据库的时候需要用到的。默认端口为80，本次我将端口设为8080.

后面所有的网页都放在AppServ/www文件夹下，就可以通过localhost:8080/来访问。

至于数据库的访问，必须要保证访问时数据库打开着，数据库的地址是：http://localhost:8080/phpmyadmin。登录名为root，密码为之前安装配置AppServ时设置的密码。这个数据库管理工具还是比较方便的，有界面，为了方便快捷可以手动创建table，也可以删除Table中的项。

简易聊天室的功能

• 注册：
  页面中由一系列表单元素组成，失去焦点时进行表单验证；
  点击注册按钮，表单验证通过时，判断该用户是否已经注册？若已注册，弹出框提示用户已注册。否则，注册成功并将注册信息保存起来。
  放上实现界面感受下：
  
• 登录：
  主要功能有：判断用户是否已注册？
  判断用户密码是否正确？
  判断该用户是否已经登录？
  
• 聊天主页面
  这是聊天主要逻辑所在。
  功能：
  左边区域显示所有人发出的消息，最多显示最近的9条（由于div高度的限制）；
  右边区域显示都有谁在线；
  底下输入框可以输入消息，点击发送就发送到每个用户，类似于群聊的功能；
  当页面关闭或者刷新时，将在线列表里将不存在该用户。

界面做的比较粗，希望大家不要嫌弃* _ *

整体的页面逻辑可以看看下图：

实现

拿每个页面来说吧

• 注册（register.html）

HTML部分：

<div id="box">
    <div class="item" id="first">
        <label for="usr">昵称:</label>
        <input type="text" name = "usr" id="uname" />
        <span id="info1"></span>
    </div>
    <div class="item" id="two">
        <label for="pwd">设置密码:</label>
        <input type="password" name="pwd" id="pass" />
        <span id="info2"></span>
    </div>
    <div class="item" id="three">
        <label for="pwd_again">确认密码:</label>
        <input type="password" name="pwd_again" id="pass1" />
        <span id="info3"></span>
    </div>
    <input