ajax注冊(cè)是現(xiàn)在我看到網(wǎng)站中所有網(wǎng)站幾乎都會(huì)使用到的一個(gè)功能,下面我就來(lái)給各位整理一個(gè)關(guān)于ajax注冊(cè)驗(yàn)證例子,希望此例子能幫助到各位哦.

html代碼如下:

1. <script src="ajax.js"></script>  
2. <form>  
3. <table> 
4. <tr> 
5.   <td>用戶名：</td> 
6.   <td><input type="text" id="txt1" onKeyUp="showHint(this.value)"></td> 
7.  </tr> 
8.  <tr align="center"> 
9.   <td colspan="2"><span id="txtHint"></span></td> 
10.  </tr> 
11. </table> 
12. </form> 

js文件代碼如下:

1. var xmlHttp 
2. function showHint(str) 
3. { 
4. if (str.length==0) 
5.   {  
6.   document.getElementById("txtHint").innerHTML="" 
7.   return 
8.   } 
9. xmlHttp=GetXmlHttpObject() 
10. if (xmlHttp==null) 
11.   { 
12.   alert ("Browser does not support HTTP Request") 
13.   return 
14.   }  
15. xmlHttp.onreadystatechange=stateChanged 
16. var geturl="conn.php?q="+str 
17. //sid是增加一個(gè)隨機(jī)數(shù) 防止頁(yè)面啟用緩存技術(shù)· 
18. geturl=geturl+"&sid="+Math.random() 
19. geturl=encodeURI(geturl); 
20. geturl=encodeURI(geturl);  
21. xmlHttp.open("GET",geturl,true) 
22. xmlHttp.send(null) 
23. }  
24. function stateChanged()  
25. {  
26. if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") 
27.  {  
28.  document.getElementById("txtHint").innerHTML=xmlHttp.responseText  
29.  }  
30. } 
31. function GetXmlHttpObject() 
32. { 
33. var xmlHttp=null; 
34. try 
35.  { 
36.  // Firefox, Opera 8.0+, Safari 
37.  xmlHttp=new XMLHttpRequest(); 
38.  } 
39. catch (e) 
40.  { 
41.  // Internet Explorer 
42.  try 
43.   { 
44.   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
45.   } 
46.  catch (e) 
47.   { 
48.   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 
49.   } 
50.  } 
51. return xmlHttp; 
52. } 

php操作代碼如下:

1. <?php 
2. $q=$_GET["q"]; 
3. $q = urldecode($q); 
4. if (strlen($q) > 0) 
5. { 
6.   $conn = @mysql_connect("localhost","root","1010") or die ("MySql連接錯(cuò)誤"); 
7.   mysql_select_db("xin",$conn); 
8.   mysql_query("set names 'utf8'"); 
9.    
10.   $sql = "SELECT username FROM message WHERE username = '$q'"; 
11.   $query = mysql_query($sql); 
12.   @$row = mysql_fetch_array($query); 
13.    
14.   if(!emptyempty($row['username'])) 
15.   {//開(kāi)源軟件:Vevb.com 
16.    $response = "<font color=red>已經(jīng)被注冊(cè)！</font>"; 
17.   }else 
18.   { 
19.    $response = "<font color=blue>恭喜！可以注冊(cè)！</font>"; 
20.   } 
21.    
22.   echo $response; 
23. } 
24. ?> 

最后再給出數(shù)據(jù)庫(kù)代碼:

1. DROP DATABASE IF EXISTS `xin`; 
2. CREATE DATABASE `xin` /*!40100 DEFAULT CHARACTER SET utf8 */; 
3. USE `xin`; 
4.  
5. CREATE TABLE `message` ( 
6.   `id` int(11) NOT NULL auto_increment, 
7.   `username` varchar(20) default NULL, 
8.   PRIMARY KEY  (`id`) 
9. ) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;