php+ajax注冊實時驗證功能

2020-03-22 17:51:10

字體：大中小

來源：轉載

供稿：網友

ajax的實時驗證技術已經很成熟了，在一些規范的網站上，如果有注冊驗證的模板，必定會涉及到ajax的無刷新驗證，這在用戶注冊的體驗中是很棒的，對比一個不能及時和后臺無刷新對接的驗證模式，要重新返回來刷新，這對于用戶來說，體驗上是很不友好的。ajax的模式幾乎是所有站點應用的需求，ajax作為前端無刷新驗證，可以和所有后臺語言進行組合使用，比如asp+ajax,php+ajax,.net+ajax等等組合，這里主要講解的是php+ajax的注冊驗證。下面的驗證是一個完整的實例，我們在網站上面注冊時，在輸入用戶名時，首先要進行無刷新驗證，要驗證一下后臺數據庫里面是否存在同名的數據，如果存在，則無刷新顯示用戶名已被占用的提示，這里一共涉及到四個文件。ajax.js:ajax技術的核心文件了，主要是驗證提示的時時顯示，這個文件通常不需要進行修改，只需要進行前端調用即可。
var xmlHttpfunction showHint(str)if (str.length==0) document.getElementById("txtHint").innerHTML="" returnxmlHttp=GetXmlHttpObject()if (xmlHttp==null) alert ("Browser does not support HTTP Request") returnxmlHttp.onreadystatechange=stateChanged var geturl="conn.php q="+str//sid是增加一個隨機數防止頁面啟用緩存技術·geturl=geturl+"&sid="+Math.random()geturl=encodeURI(geturl);geturl=encodeURI(geturl); xmlHttp.open("GET",geturl,true)xmlHttp.send(null)function stateChanged() if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") document.getElementById("txtHint").innerHTML=xmlHttp.responseText function GetXmlHttpObject()var xmlHttp=null; // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest();catch (e) // Internet Explorer xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); catch (e) xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");return xmlHttp;conn.php:這是網站的配置文件，要配置好自己本地的mysql用戶名和密碼,需要配置PHP與數據庫的連接,可以參考PHP+MYSQL數據庫連接的文章,另外要處理接受過來的數據進行時實顯示，如果有多項要驗證的文件，在這里進行多項接受和驗證即可。
$q=$_GET["q"];$q = urldecode($q);if (strlen($q) 0) $conn = @mysql_connect("localhost","root","1010") or die ("MySql連接錯誤"); mysql_select_db("xin",$conn); mysql_query("set names 'utf8'"); $sql = "SELECT username FROM message WHERE username = '$q'"; $query = mysql_query($sql); @$row = mysql_fetch_array($query); if(!empty($row['username'])) $response = " font color=red 已經被注冊！ /font }else $response = " font color=blue 恭喜！可以注冊！ /font echo $response;
index.html:這就是前端文件了，這個文件相對來說要更簡單一些，調用了ajax.js的處理文件,將要提交無刷新驗證的文件提交到conn.php和后臺進行連接。
html head meta http-equiv="Content-Type" content="text/html; charset=utf-8" script src="ajax.js" /script /head body bgcolor="#999999" center form table td 用戶名： /td td input type="text" id="txt1" onKeyUp="showHint(this.value)" /td /tr tr align="center" td colspan="2" span id="txtHint" /span /td /tr /table /form /center /body /html 庫.txt:這個就是SQL的數據庫文件了，將這個文件導入到mysql數據庫中即可。
DROP DATABASE IF EXISTS `xin`;CREATE DATABASE `xin` /*!40100 DEFAULT CHARACTER SET utf8 */;USE `xin`;
將這幾個文件保存在可以運行PHP文件的根目錄即可，測試網址為 localhost/index.html，下面是打包下載的整套文件，試著修改為自己需求的注冊模塊，比如加上密碼，姓名之類的。源碼下載：http://xiazai.phpstudy.net/201607/yuanma/php+ajaxzhuce(phpstudy.net).rar以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持phpstudy。PHP教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。

上一篇：怎么樣使用PHP連接數據庫實現注冊頁面的增刪改查操作

下一篇：PHP定時執行任務