php+ajax 등록 실시간 확인 기능
- 高洛峰원래의
- 2016-12-23 17:35:561346검색
Ajax의 실시간 확인 기술은 이미 매우 성숙되었습니다. 일부 표준화된 웹사이트에는 등록 확인을 위한 템플릿이 있는 경우 반드시 ajax의 새로 고침이 없는 확인이 포함됩니다. 이는 사용자 등록 경험에 좋습니다. 비교 적시에 새로고침하지 않으면 백그라운드에 연결할 수 없는 인증 모드는 다시 새로고침으로 돌아가야 하므로 사용자 경험에 매우 불리합니다.
Ajax 모드는 거의 모든 사이트 애플리케이션의 요구 사항이며 새로 고치지 않는 프런트 엔드 검증으로 ajax는 asp+ajax, php+ajax와 같은 모든 백엔드 언어와 함께 사용할 수 있습니다. , .net+ajax 및 기타 조합 여기서의 주요 설명은 php+ajax의 등록 확인입니다.
다음 검증은 웹사이트에 등록하고 사용자 이름을 입력할 때 먼저 새로 고치지 않는 검증을 수행하고 백그라운드 데이터베이스에 동일한 이름의 데이터가 있는지 확인해야 하는 완전한 예입니다. 존재하는 경우 사용자 이름이 이미 사용되었음을 나타내는 새로 고침 메시지가 표시되지 않습니다. 여기에는 총 4개의 파일이 포함됩니다.
ajax.js: ajax 기술의 핵심 파일입니다. 주로 수시로 확인 메시지를 표시합니다. 이 파일은 일반적으로 수정할 필요가 없으며 프런트 엔드에서만 호출하면 됩니다.
var xmlHttp
function showHint(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML=""
return
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
xmlHttp.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;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}conn.php: 이것은 웹사이트의 구성 파일입니다. 로컬 mysql 사용자 이름과 비밀번호를 구성하려면 PHP와 데이터베이스 간의 연결을 구성해야 합니다. PHP+MYSQL 데이터베이스 연결 외에도 실시간 표시를 위해 수신된 데이터를 처리하려면 확인할 문서가 여러 개 있는 경우 여기에서 다중 승인 및 확인을 수행하면 됩니다.
<?php
$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> <tr> <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>
Library.txt: SQL 데이터베이스 파일입니다. 이 파일을 mysql 데이터베이스로 가져오세요.
DROP DATABASE IF EXISTS `xin`; CREATE DATABASE `xin` /*!40100 DEFAULT CHARACTER SET utf8 */; USE `xin`; CREATE TABLE `message` ( `id` int(11) NOT NULL auto_increment, `username` varchar(20) default NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8;
이러한 파일을 PHP 파일이 실행될 수 있는 루트 디렉터리에 저장하세요. 테스트 URL은 localhost/index.html입니다. 다음은 패키지 및 다운로드된 전체 파일 세트입니다. 귀하의 필요에 따라 비밀번호, 이름 등을 추가하는 모듈을 등록하세요.
위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되기를 바랍니다.
php+ajax 등록 실시간 확인 기능에 대한 더 많은 글은 PHP 중국어 홈페이지를 주목해주세요!