首页 > 开发 > AJAX > 正文

AJAX应用实例之检测用户名是否唯一(实例代码)

2024-09-01 08:27:00
字体:
来源:转载
供稿:网友

先给大家展示下效果图,然后再给大家撸代码,效果图如下所示:

未注册用户

已注册用户

下面写一个简单的例子,检测用户名是否唯一(直接撸代码):

前端界面:

<%@ page language="java" contentType="text/html; charset=GB18030"  pageEncoding="GB18030"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=GB18030"><title>检测用户名是否唯一</title><style type="text/css"><!--#toolTip {  position:absolute;  left:331px;  top:39px;  width:98px;  height:48px;  padding-top:45px;  padding-left:25px;  padding-right:25px;  z-index:1;  display:none;  color:red;  background-image: url(images/tooltip.jpg);}--></style></head><body style="margin: 0px;"><form method="post" action="" name="form1"><table width="509" height="352" border="0" align="center" cellpadding="0" cellspacing="0" background="images/bg.gif"> <tr>  <td height="54"> </td> </tr> <tr>  <td height="253" valign="top">  <div style="position:absolute;">  <table width="100%" height="250" border="0" cellpadding="0" cellspacing="0">   <tr>    <td width="18%" height="54" align="right" style="color:#8e6723 "><b>用户名:</b></td>    <td width="49%"><input name="username" type="text" id="username" size="32"></td>    <td width="33%"><img src="images/checkBt.jpg" width="104" height="23" style="cursor:hand;" onClick="checkUser(form1.username);"></td>   </tr>   <tr>    <td height="51" align="right" style="color:#8e6723 "><b>密码:</b></td>    <td><input name="pwd1" type="password" id="pwd1" size="35"></td>    <td rowspan="2">   <div id="toolTip"></div></td>   </tr>   <tr>    <td height="56" align="right" style="color:#8e6723 "><b>确认密码:</b></td>    <td><input name="pwd2" type="password" id="pwd2" size="35"></td>    </tr>   <tr>    <td height="55" align="right" style="color:#8e6723 "><b>E-mail:</b></td>    <td colspan="2"><input name="email" type="text" id="email" size="45"></td>   </tr>   <tr>    <td> </td>    <td colspan="2"><input type="image" name="imageField" src="images/registerBt.jpg"></td>   </tr>  </table>  </div>  </td> </tr> <tr>  <td> </td> </tr></table></form></body></html>            
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表