Première introduction à la page d'inscription au développement PHP

Je pense que tout le monde conna?t la page d'inscription. La page d'inscription permet aux utilisateurs de remplir certaines informations, telles que le nom d'utilisateur, le mot de passe, l'adresse e-mail, le sexe, etc., le tout sur notre page d'inscription. Aujourd'hui, nous allons vous apprendre à créer une page d'inscription

Regardez d'abord l'image de la page d'inscription ci-dessous

L'image ci-dessus est relativement simple Sur notre page d'enregistrement, il y a un mot de passe de confirmation de plus que la page de connexion que nous avons créée auparavant. Ceci afin d'éviter que l'utilisateur ne saisisse un mot de passe différent deux fois, ce qui entra?nerait une erreur de mot de passe. Nous commencerons à créer notre page HTML dans le chapitre suivant.

Conseils?: La page d'inscription que nous vous montrons est la page d'inscription la plus simple. Elle ne comporte qu'un nom d'utilisateur et un mot de passe. Cependant, les pages d'inscription que nous rencontrons dans notre vie quotidienne incluent. numéros de téléphone portable, adresses e-mail, etc. Oui, une fois que tout le monde est familiarisé avec le programme, je pense que vous pouvez créer des pages colorées

Créer les fichiers dont nous avons besoin

< tr>< /tbody>

Nom du fichier

reg.html

reg. .php

yanzhengma.php

文件名

reg.html

reg.php

yanzhengma.php

主要功能

前臺(tái)注冊(cè)頁(yè)面

處理接收reg.html頁(yè)面?zhèn)鬟^(guò)來(lái)的數(shù)據(jù)，將數(shù)據(jù)保存到user數(shù)據(jù)表中

驗(yàn)證碼程序

< /td>

Fonctions principales

Page d'inscription

Traitez les données re?ues de la page reg.html et enregistrez les données dans la table de données utilisateur

Programme de code de vérification

Formation continue

nouveau fichier

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登陸界面</title> <script type="text/javascript"> function checkinput() { if($('#name').val() == ''){ alert("你的用戶名不能為空"); $('#name').focus(); return false; } if($('#pwd').val() == ''){ alert("你的密碼不能為空"); $('#pwd').focus(); return false; } if($('#pwd').val() != $('#pwdconfirm').val()){ alert("你輸入的兩次密碼不一致，請(qǐng)重新輸入！"); $('#pwd').focus(); return false; } if($('#yzm').val() == ''){ alert("你的驗(yàn)證碼不能為空"); $('#yzm').focus(); return false; } } </script> <style type="text/css"> body{background-color: rgba(223, 255, 231, 0.28) } .container{ border-radius: 25px; box-shadow: 0 0 20px #222; width: 380px; height: 400px; margin: 0 auto; margin-top: 200px; background-color: rgba(152, 242, 242, 0.23); } input{ width: 180px; height: 25px; } button{ background-color: rgba(230, 228, 236, 0.93); border: none; color: #110c0f; padding: 10px 70px; text-align: center; display: inline-block; font-size: 16px; cursor: pointer; margin-top: 30px; margin-left: 50px; } div.right { position: relative; left: 40px; top: 20px; } </style> </head> <body> <form action="" method="post" onsubmit=" return checkinput();" > <div class="container"> <div class="right"> <h2>用戶注冊(cè)</h2> <p>用戶名：<input type="text" name="name" id="name"></p> <p>密　　碼: <input type="password" name="pwd" id="pwd"></p> <p>確認(rèn)密碼: <input type="password" name="pwdconfirm" id="pwdconfirm"></p> <p>驗(yàn) 證碼：<input type="text" name="yzm" id="yzm"> <img src="yanzhengma.php" onClick="this.src='yanzhengma.php?nocache='+Math.random()" style="cursor:hand"></p> <p><button type="submit" value="注冊(cè)" >立即注冊(cè)</button></p> </div> </div> </form> </body> </html>

soumettre Réinitialiser le code

Opération automatique