Module d'enregistrement des utilisateurs ajax très pratique-js tutoriel-php.cn

Maison

interface Web

js tutoriel

Module d'enregistrement des utilisateurs ajax très pratique

亚连

May 23, 2018 pm 04:00 PM

ajax Module Enregistrement des utilisateurs

Cet article présente principalement en détail le module d'enregistrement des utilisateurs ajax très pratique, qui a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

L'utilisation de la technologie ajax dans la conception de sites Web est déjà très courante, surtout. dans les sites Web interactifs, la technologie ajax est encore plus indispensable. La technologie Ajax peut être vue dans presque toutes les applications de sites Web interactifs, les grands sites Web tels que l'inscription des membres, les petits sites Web tels que la technologie de pagination sans actualisation, offrent aux visiteurs du site Web une meilleure expérience utilisateur sur les sites Web locaux. conception, s'il y a une erreur lors de la navigation dans une certaine partie, il n'est pas nécessaire d'actualiser la page Web entière. La partie la plus largement utilisée est la vérification sans actualisation de l'enregistrement des membres, etc., pas d'actualisation de la pagination, affichage plus sans actualisation. , demandez si le contenu de la base de données existe sans actualisation, etc.

Ce qui suit est le module d'enregistrement des utilisateurs ajax. Ce module d'enregistrement ajax est très pratique. Il vous suffit de le développer en fonction de vos propres besoins. un fichier de données de requête, modifiez simplement le contenu de la requête par le vôtre. Il devrait être facile à comprendre. Vous pouvez le télécharger et le vérifier si nécessaire.

check.php

<?php
header("Content-Type:text/html;charset=gb2312");
@mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;ebaeba&#39;) or die("数据库服务器连接失败");
@mysql_select_db("test") or die("数据库不存在或不可用");



$uname = $_GET[&#39;userName&#39;];
//下面进行数据库查询　　查找是不是有这一个用户
//如果没有查找到这个用户名



$sql="select * from t1 where name=&#39;".$uname."&#39;";
$query=mysql_query($sql);
$row=mysql_fetch_object($query);

if(strlen($uname)<6||strlen($uname)>20)
{
 $msg="用户名必须是6至20个字符.";
}
else
{
 
 if($row==false)
 {
  $msg="该用户名有效，可以使用！";
 }
 else
 {
  $msg="对不起，此用户名已经存在，请更换用户名注册!";
 }
}
echo $msg ;
?>

reg.php

<%@page language="java" contentType="text/html;charset=gb2312"%>
<! DOCTYPE HTML PUBLIC　"-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html140/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>AJAX用户注册演示程序</title>
<script language="javascript" type="text/javascript">
<!--
//创建函数
function createXMLHTTP() 
{
 var request;
 var browser = navigator.appName;
 //使用IE，则使用XMLHttp对象
 if(browser == "Microsoft Internet Explorer") 
 {
 var arrVersions = ["Microsoft.XMLHttp", "MSXML2.XMLHttp.4.0",
  "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp","MSXML2.XMLHttp.5.0"];
 for (var i=0; i < arrVersions.length; i++) 
 {
  try 
  {
 //从中找到一个支持的版本并建立XMLHttp对象
  request = new ActiveXObject(arrVersions[i]); 
  return request;
  } 
  catch (exception)
  {
  //忽略，继续
  }
 }
 }
 else
 {
 //否则返回一个XMLHttpRequest对象
 request = new XMLHttpRequest(); 
 if(request.overrideMimeType)
 {
 　　 request.overrideMimeType(&#39;text/xml&#39;);
 　 }
 return request;
 } 
}
//全局XMLHTTP对象实例变量
var http = createXMLHTTP();
//发送请求
function chkUser()
{
 var url = "check.php"; //请求"CheckUserName" ServLet
 var name = document.getElementById("userName").value; 
 url += ("?userName="+escape(name)+"&oprate=chkUser");
 http.open("GET",url,true);
 http.onreadystatechange = ProcessHttpResponse;
 http.send(null);
 return ;
}
//处理响应
function ProcessHttpResponse()
{
 if(http.readyState == 4)
 {
 if(http.status == 200)
 {
 　 var xmlDocument = http.responseXML;
 　 if(http.responseText!="该用户名有效，可以使用！")
  {
 //返回的信息动态显示
 　　 document.getElementById("showStr").style.display = "";
 　　 document.getElementById("userName").style.background= "#FF0000";
 　　 document.getElementById("showStr").innerText = http.responseText;
 　 }
  else
  {
 　　 document.getElementById("userName").style.background= "#FFFFFF";
 　　 document.getElementById("showStr").style.display = "";
  document.getElementById("showStr").innerText = http.responseText;
 　 }
 }
 else
 {
 　　 alert("你所请求的页面发生异常，可能会影响你浏览该页的信息！");
 　　 alert(http.status);
 }
 }
}
//检验输入密码
function chkpassword()
{
 var m=document.form1;
 if(m.password.value.length>20 || m.password.value.length<6 )
 {
 document.getElementById("passwordStr").style.display = "";
　 document.getElementById("password").style.background= "#FF0000";
　 document.getElementById("passwordStr").innerText = "对不起,密码必须为英文字母、数字或下划线，长度为6~20!";
 }
 else
 {
　 document.getElementById("password").style.background= "#FFFFFF";
　 document.getElementById("passwordStr").style.display = "none";
 }
}
//验证两次密码是否一致
function chkconfirmPassword()
{
 var m=document.form1;
　 if (m.password.value != m.confirmPassword.value)
　 {
　　 document.getElementById("confirmPasswordStr").style.display = "";
　　 document.getElementById("confirmPassword").style.background= "#FF0000";
　　 document.getElementById("confirmPasswordStr").innerText = "对不起,密码与重复密码不一致!";
　 }
　 else
　 {
　　 document.getElementById("confirmPassword").style.background= "#FFFFFF";
　　 document.getElementById("confirmPasswordStr").style.display = "none";
　 }
} 
//验证Email是否有效
function chkEmail()
{
 var m=document.form1;
 var email = m.email.value; 
 //正则表达式
　 var regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/; 
　 var flag = regex.test(email);   
　 if(!flag) 
　 {
  document.getElementById("emailStr").style.display = "";
　　 document.getElementById("email").style.background= "#FF0000";
　　 document.getElementById("emailStr").innerText = "对不起,邮箱地址无效！"; 
　 } 
　 else 
　 { 
  document.getElementById("email").style.background= "#FFFFFF";
　　 document.getElementById("emailStr").style.display = "none"; 
　 }
 
}
//提交检查函数 
function SubmitCheck()
{
 var m=document.form1; 
 if(m.userName.value.length==0)
 {
　 alert("对不起,用户名必须为英文字母、数字或下划线，长度为5~20。");
　 m.userName.focus();
　 return false;
 }
 if(m.password.value.length==0)
 {
　 alert("对不起,密码必须为英文字母、数字或下划线，长度为5~20。");
　 m.password.focus();
　 return false;
 }
 if (m.password.value != m.confirmPassword.value)
 {
　 alert("对不起,密码与重复密码不一致!");
　 m.confirmPassword.focus();
　 return false;
 } 
 if(m.email.value.length==0)
 {
　 alert("对不起,邮箱地址不能为空！！");
　 m.email.focus();
　 return false; 
 }
 m.submit();
}
//--> 
</script>
<body >
<form name="form1" method="post" action="register.php">
<h3 align="center">Ajax用户注册程序</h3>
<table align="center" width="500" border="1" >
 <tr>
 <td><font color="red">*</font></td>
 <td width="100">用户帐号:</td>
 <td><input type="text" name="userName" maxlength="20" style="background=#FFFFFF" onBlur="chkUser()"></td>
 <td><p id="showStr" style="background-color:#FF9900;display:none"></p></td>
 </tr>
 <tr>
 <td><font color="red">*</font></td>
 <td>用户密码:</td>
 <td align="left"><input type="password" name="password" maxlength="22" style="background=#FFFFFF" onBlur="chkpassword()"/> </td>
 <td><p id="passwordStr" style="background-color:#FF9900;display:none"></p></td>
 </tr>
 <tr>
 <td><font color="red">*</font></td>
 <td>确认密码:</td>
 <td><input type="password" name="confirmPassword" maxlength="20" style="background=#FFFFFF" onBlur="chkconfirmPassword()"/></td>
 <td><p id="confirmPasswordStr" style="background-color:#FF9900;display:none"></p></td>
 </tr>
 <tr>
 <td><font color="red">*</font></td>
 <td>Email:</td>
 <td><input type="text" name="email" maxlength="100" style="background=#FFFFFF" onBlur="chkEmail()"></td>
 <td><p id="emailStr" style="background-color:#FF9900;display:none"></p></td>
 </tr>
</table>
<p align="center"> 
 
　 <input type="button" name="ok" value=" 确定 " onClick="SubmitCheck()">
　 <input type="reset" name="reset" value=" 取消 ">
 </form>
</p>
</body>
</html>

Ce qui précède est ce que j'ai compilé pour vous , j'espère que cela sera utile à tout le monde à l'avenir.

Outils d'IA chauds

Undress AI Tool

Images de déshabillage gratuites

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Afficher plus

Article chaud

Destiny 2: The Edge of Fate - Comment fonctionnent les modificateurs de difficulté

1 Il y a quelques mois By DDD

<🎜>: Grow A Garden - Guide complet des marchands itinérants

1 Il y a quelques mois By Jack chen

Comment sauver les 4 <🎜> enfants en 99 nuits dans la forêt

4 Il y a quelques semaines By DDD

Windows 11 KB5062660 24h2 avec fonctionnalités, liens de téléchargement direct pour installateur hors ligne (.mSU)

3 Il y a quelques semaines By Jack chen

Comment obtenir des diamants gratuits en 99 nuits dans la forêt

4 Il y a quelques semaines By DDD

Afficher plus

Outils chauds

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Afficher plus

Sujets chauds

Tutoriel PHP

1527

276

Afficher plus

Related knowledge

Liste des fonctions de connexion de l'utilisateur Laravel Apr 18, 2025 pm 01:06 PM

La création de capacités de connexion des utilisateurs à Laravel est une tâche cruciale et cet article fournira un aperçu complet couvrant toutes les étapes critiques de l'enregistrement des utilisateurs à la vérification de la connexion. Nous plongerons dans la puissance des capacités de vérification intégrées de Laravel et vous guiderons à travers la personnalisation et l'extension du processus de connexion en fonction des besoins spécifiques. En suivant ces instructions étape par étape, vous pouvez créer un système de connexion sécurisé et fiable qui offre une expérience d'accès transparente pour les utilisateurs de votre application Laravel.

En développement arrière, comment distinguer les responsabilités de la couche de service et de la couche DAO? Apr 19, 2025 pm 01:51 PM

Discuter de l'architecture hiérarchique dans le développement back-end. Dans le développement back-end, l'architecture hiérarchique est un modèle de conception courant, y compris généralement le contrôleur, le service et les trois couches DAO ...

Enregistrement des utilisateurs de la langue GO: comment améliorer l'efficacité de l'envoi des e-mails? Apr 02, 2025 am 09:06 AM

Optimisation de l'efficacité de l'envoi des e-mails dans la fonction d'enregistrement du langage GO. Dans le processus d'apprentissage du développement du backend de la langue GO, lors de la mise en œuvre de la fonction d'enregistrement des utilisateurs, il est souvent nécessaire d'envoyer une envie ...

Cohérence ultime dans les systèmes distribués: comment s'appliquer et comment compenser les incohérences des données? Apr 19, 2025 pm 02:24 PM

L'exploration de l'application de la cohérence ultime dans les systèmes distribués Le traitement des transactions distribué a toujours été un problème dans l'architecture du système distribué. Pour résoudre le problème ...

Plug-in Enregistrement du produit recommandé pour WordPress facile à utiliser Apr 20, 2025 am 08:15 AM

Il n'y a pas de plugin d'enregistrement de produit WordPress parfait, le choix doit être basé sur les besoins réels et la taille du site Web. Les plug-ins recommandés incluent: MemberPress: Configuration complexe puissante mais à prix élevé, restreindre le contenu Pro: Focus sur les restrictions de contenu et la gestion des membres, les téléchargements numériques faciles à efficacité: vendre des produits numériques et les utilisateurs s'inscrivent en fonctions supplémentaires

Comment mettre en œuvre le fragment des données dans MySQL? Méthode d'optimisation de la rupture Jun 04, 2025 pm 06:30 PM

MySQL lui-même n'a pas de fonction de rupture de données intégrée, mais peut être implémenté par la conception architecturale et les outils. Le fragmentation des données consiste à diviser de grandes données de table en plusieurs bases de données ou tables en fonction des règles pour améliorer les performances. Les méthodes de mise en œuvre courantes incluent: 1. Fragments de hachage par ID utilisateur, qui sont répartis également mais gênants pour augmenter la capacité; 2. Rasage des fragments par gamme, qui conviennent aux champs de classe temporelle mais sont faciles à chaud; 3. Algorithmes de hachage cohérents, qui réduisent la quantité de migration d'expansion mais la mise en œuvre complexe. Après le rupture, les requêtes croisées, la migration des données, les transactions distribuées et d'autres problèmes doivent être traitées. Les middleware tels que MYCAT, Vietess ou Application Layer Logic Processing peuvent être utilisés et les clés de fragment doivent être sélectionnées raisonnablement, l'équilibre des fragments doit être surveillé, un fragment excessif doit être évité et les stratégies de sauvegarde doivent être améliorées.

Binance Entrée officielle site Web Binance Binance Site Web Officiel Application de trading de devises numériques Mar 20, 2025 pm 05:36 PM

En tant que premier échange mondial de crypto-monnaie, la sécurité et la fiabilité de Binance ont attiré beaucoup d'attention, mais les sites Web de phishing sont rampants, les utilisateurs doivent donc être prudents à l'identification du portail officiel. Cet article explique en détail comment confirmer le site officiel de Binance pour éviter les pertes d'actifs causées par une entrée par erreur sur un faux site Web. Vérification via des plateformes faisant autorité telles que CoinmarketCap et Coingecko, ou consulter l'URL publiée par les médias sociaux officiels de Binance (Twitter, Telegram, etc.), et en utilisant des sites de navigation de confiance, vous pouvez identifier efficacement le portail officiel. Ne recherchez jamais directement via les moteurs de recherche et faites attention à des détails tels que la vérification si l'URL est correcte, en utilisant le chiffrement HTTPS, etc. pour assurer la sécurité des transactions et démarrer un voyage sûr d'actifs numériques.

Plateforme de trading ZB Site Web de site Web officiel du portail ZB Exchange sur le site Web officiel Mar 20, 2025 pm 05:39 PM

ZB Exchange (ZB.com) est une ancienne plateforme de trading d'actifs numériques qui fournit une variété de services de trading tels que Spot et Contracts. Cet article vise à guider les utilisateurs comment trouver en toute sécurité le site Web officiel de ZB Exchange et éviter de saisir par erreur les sites Web de phishing. Compte tenu de l'environnement réglementaire complexe des échanges de crypto-monnaies, le site officiel peut changer. Après avoir accédé au site officiel, vous devez vérifier attentivement l'URL, consulter le chiffrement HTTPS et les conseils de sécurité du site Web, et se méfier des sites Web de phishing et de fausses activités promotionnelles. Enfin, l'article souligne les risques des transactions de crypto-monnaie, y compris les risques réglementaires, les risques de sécurité, les risques opérationnels et les marchés

See all articles