Home Backend Development PHP Tutorial PHP+AJAX realizes no-refresh registration (with real-time detection of user name)_PHP tutorial

PHP+AJAX realizes no-refresh registration (with real-time detection of user name)_PHP tutorial

Jul 21, 2016 pm 04:00 PM
php+ajax personal information refresh exist real time accomplish us submit Detection register

Many times, when we register personal information online, after submitting the page, we always have to wait for the page to refresh to tell us whether the registration is successful. When the network is poor, if a large number of things are registered, after a long wait After refreshing the page, I get the message "Your username has already been used" or XXXXXXX is illegal. I think everyone must be very upset. Today I will introduce a simple registration procedure using AJAX to realize registration without page refresh + real-time detection of user information. Hope it helps everyone. Okay, let’s look at the registration interface code first:







< ;tr>
                                                                                center" bgcolor="#FFFFFF">
>
& lt; font color = "#ff6633" & gt;*& lt;/font & lt; & lt;/td & gt;
& lt; td align = "left" bgcolor = "#fffff" ID = "Chec k " > 4-16 characters, English lowercase, Chinese characters, numbers, preferably not all numbers.
                                                                                     /td>
"userpwd"

>


                                                                            td align="left" bgcolor="#FFFFFF" id="pwd"> Password letters are uppercase and lowercase. 6-16 digits (including 6 and 16), limited to English and numbers.                                                                                         /td>                 
                                                                                        ​ .resized=true; this.width=screen.width*0.7; this.style.cursor='hand'; this.alt='Click here to open new windownCTRL+Mouse wheel to zoom in/out';}" onclick= "if(!this.resized) {return true;} else {window.open('http://leehui1983.bokee.com/photo/view.fcgi?mode=3&id=4108996');}" alt="" src="http://leehui1983.bokee.com/photo/view.fcgi?mode=3&id=4108996" onload="if(this.width>screen.width*0.7) {this.resized=true; this.width =screen.width*0.7; this.alt='Click here to open new windownCTRL+Mouse wheel to zoom in/out';}" border=0>

The red part is a The js function to be called will start to be called when we select a text box. Now let's look at the code of the ajaxreg.js file contained in the page above, which contains the ajax framework and some judgment functions.
var http_request=false;
function send_request(url){//Initialization, specify the processing function, the function to send the request
http_request=false;
//Start initializing the XMLHttpRequest object
if(window.XMLHttpRequest){//Mozilla browser
http_request=new XMLHttpRequest();
if(http_request.overrideMimeType){//Set MIME category
http_request.overrideMime Type("text/xml" ;
} catch(e){
                                                                                                                                 try{ if(!http_request ){//Exception, failed to create object instance
            window.alert("Failed to create XMLHttp object!");          / Determine the request method, URL, and whether to execute the next code synchronously
http_request.open("GET",url,true);
http_request.send(null);
}
//Processing return Information function
function processrequest(){
if(http_request.readyState==4){//Judge object status
if(http_request.status==200){//The information has been returned successfully, start Processing information
document.getElementById(reobj).innerHTML=http_request.responseText;
}
else{//The page is abnormal
alert("The page you requested is not normal! ");
}
}
}
function usercheck(obj){
var f=document.reg;
var username=f.username.value;
if (username==""){
document.getElementById(obj).innerHTML=" Username cannot be empty! ";
f.username.focus();
return false;
}
else{
document.getElementById(obj).innerHTML="Reading data ...";
send_request('checkuserreg.php?username='+username);
reobj=obj;
}
}
function pwdcheck(obj){
var f=document.reg;
var pwd=f.userpwd.value;
if(pwd==""){
document.getElementById(obj).innerHTML=" User password cannot be empty! ";
                     f.userpwd.focus(); getElementById(obj).innerHTML=" The password length cannot be less than 6 characters! ";
f.userpwd.focus();
return false;
}
else{
document.getElementById(obj).innerHTML=" < font color =red>The password meets the requirements!
";
}
}
function pwdrecheck(obj){
var f=document.reg;
var repwd=f.reuserpwd.value;
if (repwd==""){
document.getElementById(obj).innerHTML=" Please enter your password again!";
                     f.reuserpwd.focus(); > document.getElementById(obj).innerHTML=" The passwords entered twice are inconsistent! ";
f.reuserpwd.focus();
return false;
}
else{
document.getElementById(obj).innerHTML=" < ;font color =red>The password entered is correct!
As for the password, only the length is judged in real time. Friends who are interested can expand the function.Let’s take a look at what checkuserreg.php does:
header('Content-Type: text/html;charset=GB2312');//Avoid garbled output
include('inc/config.inc.php');//Contains basic database configuration information
include('inc/dbclass.php');//Contains database operation classes
$username=trim($_GET ['username']);//Get the registered name
//--------------------------------- --------------------------------------------------
$db=new db;//Generate an instance from the database operation class
$db->mysql($dbhost,$dbuser,$dbpassword,$dbname);//Call the connection parameter function
$ db->createcon();//Call the create connection function
//--------------------------------- -------------------------------------------------- --
$querysql="select username from cr_userinfo where username='$username'";//Query member name
$result=$db->query($querysql);
$rows= $db->loop_query($result);
//If the member name has been registered
//------------------------ -------------------------------------------------- ---------
if($rows){
echo" This member name has already been registered, please change the member name!";
}
//If the member name is not registered, it will be displayed
//--------------------------------- -------------------------------------------------- --
else{
echo" This member name can be registered! ";
}
if($action==reg){
$addsql="insert into cr_userinfo
values(0,'$username','$userpwd', '$time',50,1,'$userquestion','$useranswer')";

$db->query($addsql);
echo" Congratulations, your registration is successful! Please clickhereto log in! ";
}
$db->close();//Close the database connection
?>

The comments are quite detailed, everyone should understand I can understand it. After checking that the information is legal, we submit the registration information to implement the PHP code for non-refresh registration, senduserinfo.php:
header('Content-Type: text/html;charset =GB2312');//Avoid garbled output
include('inc/config.inc.php');//Contain basic database configuration information
include('inc/dbclass.php');//Include Database operation class
$username=trim($_GET['username']);//Get the registration name
$userpwd=md5(trim($_GET['userpwd']));//Get the registration password
$time=date("Y-m-d");

//-------------------------- -------------------------------------------------- ----
$db=new db;//Generate an instance from the database operation class
$db->mysql($dbhost,$dbuser,$dbpassword,$dbname);//Call the connection parameter function
$db->createcon(); // Call the create connection function
//-------------------------- -------------------------------------------------- ------
//Start inserting data
//-------------------------------- -------------------------------------------------- --
$addsql="insert into cr_userinfo values(0,'$username','$userpwd','$time',50,1,'$userquestion','$useranswer')";
$db->query($addsql);
echo" Congratulations, your registration is successful! Please clickhereto log in! ";

$db->close();//Close the database connection
?>

OK!!大功告成,来看看效果图:
1.


2.


3.


4.


5.


怎么样?还不错吧,贴了这么多累死了,希望大家喜欢~~~~

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/317173.htmlTechArticle很多时候,我们在网上注册个人信息,在提交完页面后,总得等待页面刷新来告诉我们注册是否成功,遇到网络差的时候,如果注册了一大...
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

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to register multiple accounts on Xiaohongshu? Will I be discovered if I register multiple accounts? How to register multiple accounts on Xiaohongshu? Will I be discovered if I register multiple accounts? Mar 25, 2024 am 09:41 AM

As a platform integrating social networking and e-commerce, Xiaohongshu has attracted more and more users to join. Some users hope to register multiple accounts to better experience interacting with Xiaohongshu. So, how to register multiple accounts on Xiaohongshu? 1. How to register multiple accounts on Xiaohongshu? 1. Use different mobile phone numbers to register. Currently, Xiaohongshu mainly uses mobile phone numbers to register accounts. Users sometimes try to purchase multiple mobile phone number cards and use them to register multiple Xiaohongshu accounts. However, this approach has some limitations, because purchasing multiple mobile phone number cards is cumbersome and costly. 2. Use email to register. In addition to your mobile phone number, your email can also be used to register a Xiaohongshu account. Users can prepare multiple email addresses and then use these email addresses to register accounts. but

How to register a Manwa Comics account How to register a Manwa Comics account Feb 28, 2024 am 08:00 AM

On the Manwa Comics platform, there are rich comic resources waiting for everyone to explore. As long as you easily enter the official platform of Manwa Comics, you can enjoy all kinds of wonderful comic works. Everyone can easily find their favorite comics to read according to their own preferences. So how to register the official account of Manwa Comics? The editor of this website will bring you this detailed tutorial guide, hoping to help everyone in need. Manwa Comics-Official entrance: https://fuw11.cc/mw666 Manwa Comics app download address: https://www.siemens-home.cn/soft/74440.html Manwa Comics non-mainland area entrance: https: /

F5 refresh key not working in Windows 11 F5 refresh key not working in Windows 11 Mar 14, 2024 pm 01:01 PM

Is the F5 key not working properly on your Windows 11/10 PC? The F5 key is typically used to refresh the desktop or explorer or reload a web page. However, some of our readers have reported that the F5 key is refreshing their computers and not working properly. How to enable F5 refresh in Windows 11? To refresh your Windows PC, just press the F5 key. On some laptops or desktops, you may need to press the Fn+F5 key combination to complete the refresh operation. Why doesn't F5 refresh work? If pressing the F5 key fails to refresh your computer or you are experiencing issues on Windows 11/10, it may be due to the function keys being locked. Other potential causes include the keyboard or F5 key

How to register a Xiaohongshu account? What is required to register a Xiaohongshu account? How to register a Xiaohongshu account? What is required to register a Xiaohongshu account? Mar 22, 2024 am 10:16 AM

Xiaohongshu, a social platform integrating life, entertainment, shopping and sharing, has become an indispensable part of the daily life of many young people. So, how to register a Xiaohongshu account? 1. How to register a Xiaohongshu account? 1. Open the Xiaohongshu official website or download the Xiaohongshu APP. Click the &quot;Register&quot; button below and you can choose different registration methods. Currently, Xiaohongshu supports registration with mobile phone numbers, email addresses, and third-party accounts (such as WeChat, QQ, Weibo, etc.). 3. Fill in the relevant information. According to the selected registration method, fill in the corresponding mobile phone number, email address or third-party account information. 4. Set a password. Set a strong password to keep your account secure. 5. Complete the verification. Follow the prompts to complete mobile phone verification or email verification. 6. Perfect the individual

How to register a Xiaohongshu account? How to recover if its account is abnormal? How to register a Xiaohongshu account? How to recover if its account is abnormal? Mar 21, 2024 pm 04:57 PM

As one of the most popular lifestyle sharing platforms in the world, Xiaohongshu has attracted a large number of users. So, how to register a Xiaohongshu account? This article will introduce you to the Xiaohongshu account registration process in detail, and answer the question of how to recover Xiaohongshu account abnormalities. 1. How to register a Xiaohongshu account? 1. Download the Xiaohongshu APP: Search and download the Xiaohongshu APP in the mobile app store, and open it after the installation is complete. 2. Register an account: After opening the Xiaohongshu APP, click the &quot;Me&quot; button in the lower right corner of the homepage, and then select &quot;Register&quot;. 3. Fill in the registration information: Fill in the mobile phone number, set password, verification code and other registration information according to the prompts. 4. Complete personal information: After successful registration, follow the prompts to complete personal information, such as name, gender, birthday, etc. 5. Settings

How to register a qooapp account How to register a qooapp account Mar 19, 2024 pm 08:58 PM

qooapp is a software that can download many games, so how to register an account? Users need to click the &quot;Register&quot; button if they don't have a pass yet, and then choose a registration method. This account registration method introduction is enough to tell you how to operate it. The following is a detailed introduction, so take a look. How to register a qooapp account? Answer: Click to register, and then choose a registration method. Specific methods: 1. After entering the login interface, click below. Don’t have a pass yet? Apply now. 2. Then choose the login method you need. 3. You can use it directly after that. Official website registration: 1. Open the website https://apps.ppaooq.com/ and click on the upper right corner to register. 2. Select registration

How to implement dual WeChat login on Huawei mobile phones? How to implement dual WeChat login on Huawei mobile phones? Mar 24, 2024 am 11:27 AM

How to implement dual WeChat login on Huawei mobile phones? With the rise of social media, WeChat has become one of the indispensable communication tools in people's daily lives. However, many people may encounter a problem: logging into multiple WeChat accounts at the same time on the same mobile phone. For Huawei mobile phone users, it is not difficult to achieve dual WeChat login. This article will introduce how to achieve dual WeChat login on Huawei mobile phones. First of all, the EMUI system that comes with Huawei mobile phones provides a very convenient function - dual application opening. Through the application dual opening function, users can simultaneously

How to check how long it has been since WeChat registration? How to check how long you have been registered on WeChat How to check how long it has been since WeChat registration? How to check how long you have been registered on WeChat Mar 13, 2024 am 08:52 AM

WeChat is a popular social software with rich functions and many users. If you want to check how long you have been registered on WeChat, although WeChat itself does not directly provide the function of checking the registration time, we can speculate through some indirect methods. However, these methods are not absolutely accurate as various factors may affect the accuracy of the results. If you have precise requirements for the registration time, it is recommended to contact WeChat customer service for consultation. How to check how long it has been since WeChat registration? The first way to see how long you have been registered on WeChat is by checking your QQ mailbox. If you use QQ to log in to WeChat, after successful registration, your QQ mailbox will receive a welcome email from WeChat. You can search for "WeChat" in your QQ mailbox to see if there is such an email, and then determine the registration time. The second way is by looking at

See all articles
                               "reuserpwd"
>



    * td align="left" bgcolor="#FFFFFF" id="repwd"> Please enter your login password again.