JQuery实现注册页面提示语

今天看了一下jquery，感觉到了他的强大，以前看网页的javascript的效果看的是个晕的，现在jquery大大的简化了所需的代码量，并且感觉可以利用他实现所有的javascript的动态效果，并且解决了以前百思不得其解的一个问题。

类似于各个大网站的注册页面，当我们将鼠标点击一下输入框时，旁边就会显示一些提示语，我的想法是，在输入框的旁边定位一个div框，将里面的的内容置为空（&nbsp），那么当获得输入框的焦点时，用html函数将里面的字给改了就OK，当失去焦点再改为空。

代码:

 

 
 <script src="js/jquery.js" type="text/javascript"></script>
 
<script type="text/javascript">
$(document).ready(function(){
  $("input#user").focus(function(){
  $(".user").html("只包含字母和数字,并且不能低于六位");
  });
  $("input#user").blur(function(){
  $(".user").html(" ");
  });
   $("input#pas").focus(function(){
  $(".pas").html("所输入的密码不能低于六位");
  });
  $("input#pas").blur(function(){
  $(".pas").html(" ");
  });
    $("input#repas").focus(function(){
  $(".repas").html("请输入正确的密码");
  });
  $("input#repas").blur(function(){
  $(".repas").html(" ");
  });
});
</script>

 <form action="#" method="post">
 <div align="center" style="position:relative;left;left: 0px; top: 0px;" >
 <table>
  <tr>
   <td align="right">用户名:</td>
     <td width=442 align="left"><input name="user_id" size=30  maxlength="20" type='text' id='user' />*
   <div class="user" style="position:absolute; width: 231px; left: 375px; top: 5px;">&nbsp;</div></td>
  </tr>
  <tr>
   <td align="right">密码:</td>
   <td align="left"><input name="password" size=30 maxlength="20" type='password' id='pas'>*
   <div class="pas" style="position:absolute; width: 231px; left: 375px; top: 30px;">&nbsp;</div></td>
  </tr>
  <tr>
   <td align="right">重复密码:</td>
   <td align="left"><input name="rptpassword" size=30 maxlength="20" type='password' id='repas'>*
   <div class="repas" style="position:absolute; width: 231px; left: 375px; top: 55px;">&nbsp;</div></td>
  </tr>
<table>
</form>