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+PHP+Mysql实现抽奖程序
Apr 12 jQuery
jQuery 控制文本框自动缩小字体填充
Jun 16 jQuery
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
Jul 22 jQuery
jQuery实现简单日期格式化功能示例
Sep 19 jQuery
webpack写jquery插件的环境配置
Dec 21 jQuery
jQuery实现基本淡入淡出效果的方法详解
Sep 05 jQuery
jQuery实现图片下载代码
Jul 18 jQuery
jQuery实现提交表单时不提交隐藏div中input的方法
Oct 08 jQuery
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 jQuery
jQuery实现手风琴效果(蒙版)
Jan 11 jQuery
jQuery实现小火箭返回顶部特效
Feb 03 jQuery
深入分析jQuery.one() 函数
Jun 03 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
PHP中file_exists与is_file,is_dir的区别介绍
2012/09/12 PHP
destoon实现调用热门关键字的方法
2014/07/15 PHP
PHP判断是否连接上网络的方法
2015/07/01 PHP
CI框架文件上传类及图像处理类用法分析
2016/05/18 PHP
CI框架中$this-&gt;load-&gt;library()用法分析
2016/05/18 PHP
实现PHP中session存储及删除变量
2018/10/15 PHP
PHP商品秒杀问题解决方案实例详解【mysql与redis】
2019/07/22 PHP
PHP 计算两个时间段之间交集的天数示例
2019/10/24 PHP
一个基于jquery的图片切换效果
2010/07/06 Javascript
Extjs显示从数据库取出时间转换JSON后的出现问题
2012/11/20 Javascript
JS图片切换的具体方法(带缩略图版)
2013/11/12 Javascript
JS生成不重复随机数组的函数代码
2014/06/10 Javascript
JS获取浏览器语言动态加载JS文件示例代码
2014/10/31 Javascript
Jquery效果大全之制作电脑健康体检得分特效附源码下载
2015/11/02 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
Nodejs从有门道无门菜鸟起飞必看教程
2016/07/20 NodeJs
浅谈jquery之on()绑定事件和off()解除绑定事件
2016/10/26 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
2017/04/14 Javascript
Vue-Router进阶之滚动行为详解
2017/09/13 Javascript
javascript数组定义的几种方法
2017/10/06 Javascript
React根据宽度自适应高度的示例代码
2017/10/11 Javascript
vue中使用element-ui进行表单验证的实例代码
2018/06/22 Javascript
Javascript中parseInt的正确使用方式
2018/10/17 Javascript
用vite搭建vue3应用的实现方法
2021/02/22 Vue.js
Python实现名片管理系统
2020/02/14 Python
html5定制表单_动力节点Java学院整理
2017/07/11 HTML / CSS
html5 application cache遇到的严重问题
2012/12/26 HTML / CSS
美国在线印刷公司:PsPrint
2017/10/12 全球购物
Ryderwear美国官网:澳大利亚高端健身训练装备品牌
2018/04/24 全球购物
实习护士自我鉴定
2013/10/13 职场文书
司机检讨书
2014/02/13 职场文书
五四青年节优秀演讲稿范文
2014/05/28 职场文书
护理专业求职信
2014/06/15 职场文书
人大调研汇报材料
2014/08/14 职场文书
校园安全教育心得体会
2016/01/15 职场文书
Vue.js中v-for指令的用法介绍
2022/03/13 Vue.js