php+javascript实现用户注册模块(附源码)
php+javascript实现用户注册模块(附源码)
一、功能介绍
使用语言: html + javascript + ajax + php
后端数据库:MySQL
(* 这里不涉及到样式)
成功注册流程:
① 注册页面(register.html),该页面提供一个 form表单,收集用户信息。
② 提交后转到register.php页面,利用php将注册信息添加到数据库中。
二、实现代码
(1) 创建MySql数据库中的用户信息表
需求:创建用户信息表:
代码:
CREATE TABLE xxx_user( uid INT PRIMARY KEY AUTO_INCREMENT, uname VARCHAR(32), upwd VARCHAR(32), email VARCHAR(64), phone VARCHAR(16), gender INT #性别 0-女 1-男 );
(2) HTML页面布局代码
需求:创建一个register.html(非ajax),提供以下控件(表单)——
● 登录名称-文本框
● 登录密码-密码框
● 确认密码-密码框
● 用户邮箱-电子邮件
● 联系方式-文本框
● 用户性别-下拉框
● 注册按钮
代码
<form action="./data/users/register.php" method="post"> <!-- 1.注册信息不用异步加载,直接提交表单;失去焦点时验证用户名密码是否正确,再用ajax异步加载数据; 2.form表单作用:收集用户信息并提交给服务器; 3.属性action作用:定义表单被提交时发生的动作,通常定义的是服务器上处理程序的地址(url),提交到注册的php文件,默认提交给本页; 4.属性method作用:指定表单数据的提交方式。 get(默认值)——明文提交,待提交的数据会显示在地址栏上; post——隐式提交,提交的数据不会显示在地址栏上。 --> <!--控件提交信息,嵌套在form标记里面--> <!--登录名称-文本框--> <p> 登录名称:<input type="text" id="uname" name="uname" onblur="check_name()"> <!--提示用户名是否一致的位置--> <span id="uname-show"></span> <!--提交数据时提交name属性的值,点击submit时,name属性通过表单form提交数据,同步提交数据--> </p> <!--登录密码-密码框--> <p> 登录密码:<input type="password" id="upwd" name="upwd"> <!--name值与id值可以重复,name值用于提交给服务器,id值在前端用--> </p> <!--确认密码-密码框--> <p> 确认密码:<input type="password" id="cpwd" name="cpwd" onblur="check_pwd()"> <!--onblur为失去焦点属性,调用判断密码是否一致的函数--> <!--用于提示两次密码是否一致的位置--> <span id="pwd-show"></span> </p> <!--用户邮箱-电子邮件--> <p> 电子邮箱:<input type="email" name="email"> <!--type="email" 可做简单的格式验证--> </p> <!--联系方式-文本框--> <p> 手机号码:<input type="text" name="phone"> </p> <!--用户性别-下拉框--> <p> 用户性别: <select name="gender"> <option value="1">男</option> <option value="0">女</option> </select> <!--下拉列表和选项,往数据库中插入的是value的值--> </p> <!--注册按钮--> <p> <input type="submit" value="注册"> <!--submit按钮的表单提交数据,是同步访问数据的方式--> </p> </form>
(3) 创建register.php
需求:① 在init.php中,封装会重复用到的连接数据库
代码如下:
<?php //data/init.php //创建到服务器的连接,连接数据库 $conn=mysqli_connect("127.0.0.1","root","","knewone",3306); $sql="SET NAMES UTF8"; mysqli_query($conn,$sql);
需求:② 接收register.html提交过来的数据,并插入到数据库,再给出提示
代码如下:
<?php //data/users/register.php #1.获取请求提交的数据 $uname=$_REQUEST["uname"]; //uname值就是前端页面中name属性的值 $upwd=$_REQUEST["upwd"]; //确认密码不用获取,获取一个密码就行 $email=$_REQUEST["email"]; $phone=$_REQUEST["phone"]; $gender=$_REQUEST["gender"]; #2.连接到数据库 require("../init.php"); #3.拼sql语句并执行 $sql="insert into xxx_user(uname,upwd,email,phone,gender)values('$uname','$upwd','$email','$phone','$gender')"; //字段值 外面用双引号,里面用单引号 $result=mysqli_query($conn,$sql); //执行sql语句 #4.根据执行结果给出响应 if($result==true){ //函数返回值 echo "注册成功"; }else{ echo "注册失败"; };
(4) javascript代码
需求:① 封装能重用到的函数
代码如下:
<script> //1.封装函数,获取id值 function $(id){ return document.getElementById(id); } //2.创建xhr对象 function createXhr(){ var xhr=null; if(window.XMLHttpRequest){ xhr=new XMLHttpRequest(); //标准创建 }else{ //IE8以下的创建方式 xhr=new ActiveXObject("Microsoft.XMLHttp"); } return xhr; } </script>
需求:② 实现前端页面中完成验证用户名称的重复性和两次密码是否一致的功能
代码如下:
<script src="./js/common.js"></script> <script> //1.完成用户名称的重复性验证(异步,检查数据库中是否已存在当前用户名) //异步请求数据,因为还要输入下面的数据,不能跳转到php页面去验证 function check_name(){ //1.创建XHR对象 创建异步对象 var xhr=createXhr(); //调用common.js中封装好的函数 //2.创建请求 var uname=$("uname").value; //获取输入框里的值,把用户名传到后端,再查询 var url="./data/users/check-name.php?uname="+uname; xhr.open("get",url,true); //查询用户名称,用get方法就行,去数据库查询,看用户名是否已经存在 //查询用get就行,向服务器提交数据时再用post //3.设置回调函数,监听状态 //参数true,异步 xhr.onreadystatechange=function(){ if(xhr.readyState==4 && xhr.status==200){ //判断状态,xhr请求状态为4,表示接收响应数据成功;当status的值是200的时候,表示服务器已经正确的处理请求以及给出响应 $("uname-show").innerHTML=xhr.responseText; //提示内容 }; }; //4.发送请求 xhr.send(null); //get请求,参数写null } //2.定义函数,判断两次密码是否一致 //当确认密码框失去焦点时,验证两次输入的密码是否一致,并给出提示(通过/密码不一致) //给upwd 和 cpwd 加id function check_pwd(){ //1.获取两个密码框的值 var upwd=$("upwd").value; //$("upwd") 获取id值,函数在common.js中封装 var cpwd=$("cpwd").value; if(upwd==cpwd && upwd!=""){ //判断是否相等,且密码不为空 $("pwd-show").innerHTML="通过"; //提示到span中,用innerHTML }else{ $("pwd-show").innerHTML="两次密码输入不一致"; }; }; </script>
(5) 验证用户名是否重复的php代码
功能:接受前端传来的uname值,查询数据库中是否存在同样的名称,并给出返回提示
代码如下:
<?php //data/users/check-name.php #1.连接数据库 require("../init.php"); #2.接收前端传过来的uname $uname=$_REQUEST["uname"]; #3.拼接sql,并查询uname是否存在 $sql="SELECT * FROM xxx_user uname='$uname'"; $result=mysqli_query($conn,$sql); #4.根据查询的结果输出相应 $row=mysqli_fetch_row($result); //抓取一条数据,即当前uname对应的数据 if($row==null){ //如果$row为空,即数据库中没有相同的用户名存在 echo "通过"; }else{ echo "用户名称已存在"; };
感谢大家的阅读,希望大家在查看代码以后可以有所收益。
本文转自:https://blog.csdn.net/weixin_38840741/article/details/80030792
推荐教程:《PHP教程》
Atas ialah kandungan terperinci php+javascript实现用户注册模块(附源码). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

PHP dan Python masing -masing mempunyai kelebihan mereka sendiri, dan memilih mengikut keperluan projek. 1.PHP sesuai untuk pembangunan web, terutamanya untuk pembangunan pesat dan penyelenggaraan laman web. 2. Python sesuai untuk sains data, pembelajaran mesin dan kecerdasan buatan, dengan sintaks ringkas dan sesuai untuk pemula.

PHP masih dinamik dan masih menduduki kedudukan penting dalam bidang pengaturcaraan moden. 1) kesederhanaan PHP dan sokongan komuniti yang kuat menjadikannya digunakan secara meluas dalam pembangunan web; 2) fleksibiliti dan kestabilannya menjadikannya cemerlang dalam mengendalikan borang web, operasi pangkalan data dan pemprosesan fail; 3) PHP sentiasa berkembang dan mengoptimumkan, sesuai untuk pemula dan pemaju yang berpengalaman.

PHP digunakan untuk membina laman web dinamik, dan fungsi terasnya termasuk: 1. Menjana kandungan dinamik dan menghasilkan laman web secara real time dengan menyambung dengan pangkalan data; 2. Proses Interaksi Pengguna dan Penyerahan Bentuk, Sahkan Input dan Menanggapi Operasi; 3. Menguruskan sesi dan pengesahan pengguna untuk memberikan pengalaman yang diperibadikan; 4. Mengoptimumkan prestasi dan ikuti amalan terbaik untuk meningkatkan kecekapan dan keselamatan laman web.

Apache menyambung ke pangkalan data memerlukan langkah -langkah berikut: Pasang pemacu pangkalan data. Konfigurasikan fail web.xml untuk membuat kolam sambungan. Buat sumber data JDBC dan tentukan tetapan sambungan. Gunakan API JDBC untuk mengakses pangkalan data dari kod Java, termasuk mendapatkan sambungan, membuat kenyataan, parameter mengikat, melaksanakan pertanyaan atau kemas kini, dan hasil pemprosesan.

PHP digunakan secara meluas dalam e-dagang, sistem pengurusan kandungan dan pembangunan API. 1) e-dagang: Digunakan untuk fungsi keranjang belanja dan pemprosesan pembayaran. 2) Sistem Pengurusan Kandungan: Digunakan untuk penjanaan kandungan dinamik dan pengurusan pengguna. 3) Pembangunan API: Digunakan untuk Pembangunan API RESTful dan Keselamatan API. Melalui pengoptimuman prestasi dan amalan terbaik, kecekapan dan pemeliharaan aplikasi PHP bertambah baik.

PHP dan Python mempunyai kelebihan dan kekurangan mereka sendiri, dan pilihannya bergantung kepada keperluan projek dan keutamaan peribadi. 1.PHP sesuai untuk pembangunan pesat dan penyelenggaraan aplikasi web berskala besar. 2. Python menguasai bidang sains data dan pembelajaran mesin.

PHP terutamanya pengaturcaraan prosedur, tetapi juga menyokong pengaturcaraan berorientasikan objek (OOP); Python menyokong pelbagai paradigma, termasuk pengaturcaraan OOP, fungsional dan prosedur. PHP sesuai untuk pembangunan web, dan Python sesuai untuk pelbagai aplikasi seperti analisis data dan pembelajaran mesin.

PHP menggunakan sambungan MySQLI dan PDO untuk berinteraksi dalam operasi pangkalan data dan pemprosesan logik sisi pelayan, dan memproses logik sisi pelayan melalui fungsi seperti pengurusan sesi. 1) Gunakan MySQLI atau PDO untuk menyambung ke pangkalan data dan laksanakan pertanyaan SQL. 2) Mengendalikan permintaan HTTP dan status pengguna melalui pengurusan sesi dan fungsi lain. 3) Gunakan urus niaga untuk memastikan atomik operasi pangkalan data. 4) Mencegah suntikan SQL, gunakan pengendalian pengecualian dan sambungan penutup untuk debugging. 5) Mengoptimumkan prestasi melalui pengindeksan dan cache, tulis kod yang sangat mudah dibaca dan lakukan pengendalian ralat.
