Home > Web Front-end > JS Tutorial > Ajax verification username (detailed graphic and text explanation)

Ajax verification username (detailed graphic and text explanation)

php中世界最好的语言
Release: 2018-04-04 16:17:57
Original
1474 people have browsed it

This time I bring you Ajax user name verification (detailed pictures and texts). What are the precautions for Ajax user name verification? The following is a practical case, let’s take a look.

The code to verify the username with Ajax is as follows:

Interface:

 get
guestbook/index.php
m : index
a : verifyUserName
username : 要验证的用户名
Copy after login

Return

{
code : 返回的信息代码 0 = 没有错误,1 = 有错误
message : 返回的信息 具体返回信息
}
Copy after login

js

oUser
name1.onblur = function() { //失去焦点的时候,把当前用户名给后端去验证
ajax('get', 'guestbook/index.php', 'm=index&a=verifyUserName&username=' + this.value, function(data) {
//alert(data); 浏览器调试查看
var d = JSON.parse(data); //解析
oVerifyUserNameMsg.innerHTML = d.message; //将返回信息展示到页面上
if (d.code) { //code : 返回的信息代码 0 = 没有错误,1 = 有错误
oVerifyUserNameMsg.style.color = 'red'; //错误信息加红色
} else {
oVerifyUserNameMsg.style.color = 'green'; //正确信息加绿色
}
});
}
Copy after login

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

How Ajax implements asynchronous user name verification

jQuery+AJAX calling page background

The above is the detailed content of Ajax verification username (detailed graphic and text explanation). For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template