欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

javascript和jquery实现用户登录验证

时间:2021-05-11 08:54:30|栏目:JavaScript代码|点击:

在上一篇文章//www.jb51.net/article/83504.htm中,用javascript实现了用户验证,但并没有对密码进行验证,这次追加了这个功能,并分别用javascript和jquery实现。

一.用jquery的ajax实现的关键代码

实现如下

/*jquery实现
$(document).ready(function(){
 $("#account").blur(function(event) {
 $.ajax({
  type:"GET",
  url:"checkAccount.php?account="+$("#account").val(),
  dataTypes:"text",
  success:function(msg){
  $("#accountStatus").html(msg);
  },
  error:function(jqXHR) {
  alert("账号发生错误!")
  },
 });
 });
 
 $("#password").blur(function(event) {
 $.ajax({
  type:"GET",
  url:"checkPassword.php?",
  dataTypes:"text",
  data:"account="+$("#account").val()+"&password="+$("#password").val(),
  success:function(msg){
  $("#passwordStatus").html(msg);
  },
  error:function(jqXHR) {
  alert("密码查询发生错误!")
  },
 });
 });
}); */

二.用javascript实现的关键代码

实现如下

//javascript实现
 function checkAccount(){
 var xmlhttp;
 var name = document.getElementById("account").value;
 if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
 else
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 
 xmlhttp.open("GET","checkAccount.php?account="+name,true);
 xmlhttp.send();
 
 xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
  document.getElementById("accountStatus").innerHTML=xmlhttp.responseText;
 }
 }
 
 function checkPassword(){
 var xmlhttp;
 var name = document.getElementById("account").value;
 var pw = document.getElementById("password").value;
 if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
 else
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 
 xmlhttp.open("GET","checkPassword.php?account="+name+"&password="+pw,true);
 xmlhttp.send();
 
 xmlhttp.onreadystatechange=function(){
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
  document.getElementById("passwordStatus").innerHTML=xmlhttp.responseText;
 }
 }

mysql和数据库部分跟上篇博文的一样没有改变,运行结果如下图

以上就是本文的全部内容,希望对大家的学习有所帮助。

上一篇:javascript 冒号 使用说明

栏    目:JavaScript代码

下一篇:记录一次开发微信网页分享的步骤

本文标题:javascript和jquery实现用户登录验证

本文地址:http://www.codeinn.net/misctech/119292.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有