jQuery+ajax实现修改密码验证功能实例详解


Posted in jQuery onJuly 06, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<script type="text/JavaScript">
  //获取url中的参数
  $(function(){
    var userName = window.location.href;
    var aa = userName.indexOf("=");
      console.log(userName);
    if (aa == -1)
      return "";
    userName=userName.substring(aa+1);
    //给hidden赋值并显示
    $("#userName").val(userName).attr("type","text");
    //ajax请求修改密码
    var rePassword = $("#repeatPassword").val();
    //6到15位字母或数字
    var reg=/^[0-9a-zA-Z]{6,15}$/;
    //新密码校验
    $("#newPassword").blur(function(){
      $("#msg").css("display","none");
      var newPassword = $("#newPassword").val();
      if(newPassword==""||newPassword==null){
       $("#msg").html("请输入新密码!").css("display","block");
      }elseif(!reg.test(newPassword)){
       $("#msg").html("密码格式不正确,请重新输入!").css("display","block");
      }
    });
    //重复密码校验
    $("#repeatPassword").blur(function(){
      var newPass = $("#newPassword").val();
      var repPass = $("#repeatPassword").val();
      if(newPass != repPass){
       $("#msg").html("两次输入密码不一致,请重输!").css("display","block");
      }
    });
    //表单提交前校验
    $("#updateBtn").click(function(){
      var flag = true;
      var newPass = $("#newPassword").val();
      var repPass = $("#repeatPassword").val();
      var reg1=/^[0-9a-zA-Z]{6,15}$/;
      if(!reg1.test(newPass)||newPass!=repPass||newPass ==""||newPass==null){
       flag = false;
      }
      if(flag){
       $.ajax({
         url:"/HuaMuWebsite/userManage/editPassword?userName="+userName,
         type:"POST",
         async:false,
         data:$("#fm").serialize(), //表单数据序列化, 可以对form表单进行序列化,从而将form表单中的所有参数传递到服务端。
         success:function(data){
         //json字符串转为json对象
         var jsonObj=eval("("+data+")");
         if(jsonObj.success != null){
           alert(jsonObj.success);
           window.location.href="/HuaMuWebsite/admin/login.html" rel="external nofollow" ;
         }else{
           alert(jsonObj.failure);
         }
       },
       error:function(e){
         alert("请求出错!");
       }
       });
      }   
});
  });
</script>
jQuery 相关文章推荐
jquery实现提示语淡入效果
May 05 jQuery
jquery实现图片轮播器
May 23 jQuery
jQuery中.attr()和.data()的区别分析
Sep 03 jQuery
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
jQuery实现checkbox的简单操作
Nov 18 jQuery
jQuery Dom元素操作技巧
Feb 04 jQuery
jQuery实现判断上传图片类型和大小的方法示例
Apr 11 jQuery
通过jquery.cookie.js实现记住用户名、密码登录功能
Jun 20 jQuery
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
JavaScript实现的滚动公告特效【基于jQuery】
Jul 10 jQuery
Jquery异步上传文件代码实例
Nov 13 jQuery
jquery实现垂直手风琴菜单
Mar 04 jQuery
jQuery实现选中行变色效果(实例讲解)
Jul 06 #jQuery
运用jQuery写的验证表单(实例讲解)
Jul 06 #jQuery
使用 jQuery 实现表单验证功能
Jul 05 #jQuery
jQuery制作input提示内容(兼容IE8以上)
Jul 05 #jQuery
jQuery常见面试题之DOM操作详析
Jul 05 #jQuery
jQuery使用ajax_动力节点Java学院整理
Jul 05 #jQuery
jQuery扩展_动力节点Java学院整理
Jul 05 #jQuery
You might like
基于Discuz security.inc.php代码的深入分析
2013/06/03 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(六)
2014/06/23 PHP
PHP与MYSQL中UTF8 中文排序示例代码
2014/10/23 PHP
PHP最常用的正则表达式
2017/02/13 PHP
Yii框架安装简明教程
2020/05/15 PHP
ExtJS实现文件下载的方法实例
2013/11/09 Javascript
Javascript保存网页为图片借助于html2canvas库实现
2014/09/05 Javascript
从数据库读取数据后将其输出成html标签的三种方法
2014/10/13 Javascript
实例代码详解jquery.slides.js
2015/11/16 Javascript
JavaScrip常见的一些算法总结
2015/12/28 Javascript
JavaScript兼容性总结之获取非行间样式案例
2016/08/07 Javascript
Bootstrap CSS布局之按钮
2016/12/17 Javascript
原生和jQuery的ajax用法详解
2017/01/23 Javascript
AngularJS基于provider实现全局变量的读取和赋值方法
2017/06/28 Javascript
详解React-Native全球化多语言切换工具库react-native-i18n
2017/11/03 Javascript
Vue作用域插槽slot-scope实例代码
2018/09/05 Javascript
nuxt 服务器渲染动态设置 title和seo关键字的操作
2020/11/05 Javascript
python实现比较两段文本不同之处的方法
2015/05/30 Python
Python浅复制中对象生存周期实例分析
2018/04/02 Python
Python读取视频的两种方法(imageio和cv2)
2018/04/15 Python
Python框架Flask的基本数据库操作方法分析
2018/07/13 Python
Python 实现「食行生鲜」签到领积分功能
2018/09/26 Python
Python Numpy 实现交换两行和两列的方法
2019/06/26 Python
对Django中static(静态)文件详解以及{% static %}标签的使用方法
2019/07/28 Python
tensorflow 变长序列存储实例
2020/01/20 Python
Python列表如何更新值
2020/05/27 Python
详解如何用HTML5 Canvas API控制图片的缩放变换
2016/03/22 HTML / CSS
荷兰皇家航空公司官方网站:KLM Royal Dutch Airlines
2017/12/07 全球购物
图库照片、免版税图片、矢量艺术、视频片段:Depositphotos
2019/08/02 全球购物
社区护士演讲稿
2014/08/27 职场文书
水利专业大学生职业生涯规划书范文
2014/09/17 职场文书
庆七一宣传标语
2014/10/08 职场文书
教师节寄语2015
2015/03/23 职场文书
网络营销实训总结
2015/08/03 职场文书
python获取淘宝服务器时间的代码示例
2021/04/22 Python
为了顺利买到演唱会的票用Python制作了自动抢票的脚本
2021/10/16 Python