javascript和jquery实现用户登录验证


Posted in Javascript onMay 04, 2016

在上一篇文章//3water.com/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和jquery实现用户登录验证

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

Javascript 相关文章推荐
DHTML Slide Show script图片轮换
Mar 03 Javascript
js输出列表实现代码
Sep 12 Javascript
jquery中的常用事件bind、hover、toggle等示例介绍
Jul 21 Javascript
判断window.onload是否多次使用的方法
Sep 21 Javascript
我用的一些Node.js开发工具、开发包、框架等总结
Sep 25 Javascript
jQuery实现移动 和 渐变特效的点击事件
Feb 26 Javascript
三个js循环的关键字示例(for与while)
Feb 16 Javascript
jquery 动态合并单元格的实现方法
Aug 26 Javascript
vuejs简单验证码功能完整示例
Jan 08 Javascript
Vue 2.0双向绑定原理的实现方法
Oct 23 Javascript
javascript实现放大镜功能
Dec 09 Javascript
vue实现简易的双向数据绑定
Dec 29 Vue.js
基于Bootstrap使用jQuery实现简单可编辑表格
May 04 #Javascript
纯JS代码实现气泡效果
May 04 #Javascript
DWR中各种java方法的调用
May 04 #Javascript
js实现div在页面拖动效果
May 04 #Javascript
JS功能代码集锦
May 04 #Javascript
Markdown与Bootstrap相结合实现图片自适应属性
May 04 #Javascript
浅析Bootstrap组件之面板组件
May 04 #Javascript
You might like
海贼王:最美的悬赏令!
2020/03/02 日漫
PHP 作用域解析运算符(::)
2010/07/27 PHP
php URL验证正则表达式
2011/07/19 PHP
使用openssl实现rsa非对称加密算法示例
2014/01/24 PHP
JS支持带x身份证号码验证函数
2008/08/10 Javascript
JavaScript 入门基础知识 想学习js的朋友可以参考下
2009/12/26 Javascript
JavaScript DOM学习第一章 W3C DOM简介
2010/02/19 Javascript
jquery多选项卡效果实例代码(附效果图)
2013/03/23 Javascript
javascript实现点击后变换按钮显示文字的方法
2015/05/13 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
2016/06/01 Javascript
web前端开发upload上传头像js示例代码
2016/10/22 Javascript
js节流防抖应用场景,以及在vue中节流防抖的具体实现操作
2020/09/21 Javascript
利用Python爬取可用的代理IP
2016/08/18 Python
Python基础教程之tcp socket编程详解及简单实例
2017/02/23 Python
Python json 错误xx is not JSON serializable解决办法
2017/03/15 Python
Python爬取qq music中的音乐url及批量下载
2017/03/23 Python
利用python批量给云主机配置安全组的方法教程
2017/06/21 Python
Flask 让jsonify返回的json串支持中文显示的方法
2018/03/26 Python
python中tkinter的应用:修改字体的实例讲解
2019/07/17 Python
python bluetooth蓝牙信息获取蓝牙设备类型的方法
2019/11/29 Python
python使用SQLAlchemy操作MySQL
2020/01/02 Python
python中使用paramiko模块并实现远程连接服务器执行上传下载功能
2020/02/29 Python
印度最大的酒店品牌网络:OYO Rooms
2016/07/24 全球购物
亚洲最大的眼镜批发商和零售商之一:Glasseslit
2018/10/08 全球购物
夜大毕业生自我评价分享
2013/11/10 职场文书
宿舍使用违章电器检讨书
2014/01/12 职场文书
劲霸男装广告词
2014/03/21 职场文书
医生爱岗敬业演讲稿
2014/08/26 职场文书
人身意外保险授权委托书
2014/10/01 职场文书
县政协领导班子群众路线教育实践活动四风问题整改方案
2014/10/26 职场文书
2014年法院工作总结
2014/11/24 职场文书
食品质检员岗位职责
2015/04/08 职场文书
2015大学生暑期实习报告
2015/07/13 职场文书
领导离职感言
2015/08/03 职场文书
MySQL导致索引失效的几种情况
2022/06/25 MySQL
js基于div丝滑实现贝塞尔曲线
2022/09/23 Javascript