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 EasyUI 表单组件增加焦点切换功能的方法
Apr 13 jQuery
jQuery dateRangePicker插件使用方法详解
Jul 28 jQuery
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
Aug 09 jQuery
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
Aug 23 jQuery
jQuery Position方法使用和兼容性
Aug 23 jQuery
jQuery进阶实践之利用最优雅的方式如何写ajax请求
Dec 20 jQuery
jQuery实现form表单序列化转换为json对象功能示例
May 23 jQuery
Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法
Aug 09 jQuery
jQuery+CSS实现的标签页效果示例【测试可用】
Aug 14 jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 jQuery
jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法
Jan 18 jQuery
JQuery实现ul中添加LI和删除指定的Li元素功能完整示例
Oct 16 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在文件指定行中写入代码的方法
2012/05/23 PHP
WordPress后台中实现图片上传功能的实例讲解
2016/01/11 PHP
php基于curl主动推送最新内容给百度收录的方法
2016/10/14 PHP
PHP数据对象映射模式实例分析
2019/03/29 PHP
基于jquery实现拆分姓名的方法(纯JS版)
2013/05/08 Javascript
javascript实现的多个层切换效果通用函数实例
2015/07/06 Javascript
JS根据key值获取URL中的参数值及把URL的参数转换成json对象
2015/08/26 Javascript
jquery判断input值不为空的方法
2016/06/05 Javascript
微信公众号  提示:Unauthorized API function 问题解决方法
2016/12/05 Javascript
Angular2使用vscode断点调试ts文件的方法
2017/12/13 Javascript
纯JS实现可用于页码更换的飞页特效示例
2018/05/21 Javascript
在Angular中实现一个级联效果的下拉框的示例代码
2020/05/20 Javascript
微信小程序实现watch监听
2020/06/04 Javascript
小程序实现多个选项卡切换
2020/06/19 Javascript
js实现简单扫雷
2020/11/27 Javascript
关于vue的列表图片选中打钩操作
2020/09/09 Javascript
解决vue数据不实时更新的问题(数据更改了,但数据不实时更新)
2020/10/27 Javascript
[58:57]2018DOTA2亚洲邀请赛3月29日小组赛B组 Effect VS VGJ.T
2018/03/30 DOTA
Python生成验证码实例
2014/08/21 Python
在Python下利用OpenCV来旋转图像的教程
2015/04/16 Python
Python之Scrapy爬虫框架安装及简单使用详解
2017/12/22 Python
pytorch 在sequential中使用view来reshape的例子
2019/08/20 Python
python3+openCV 获取图片中文本区域的最小外接矩形实例
2020/06/02 Python
详解Python+Selenium+ChromeDriver的配置和问题解决
2021/01/19 Python
万得城电器土耳其网站:欧洲第一大电子产品零售商
2016/10/07 全球购物
应届生高等护理求职信
2013/10/12 职场文书
优秀干部获奖感言
2014/01/31 职场文书
公司经理聘任书
2014/03/29 职场文书
美术第二课堂活动总结
2014/07/08 职场文书
十一国庆节“向国旗敬礼”主题班会活动方案
2014/09/27 职场文书
职场新人刚入职工作总结该怎么写?
2019/05/15 职场文书
研究生学习计划书应该怎么写?
2019/09/10 职场文书
JavaWeb 入门篇:创建Web项目,Idea配置tomcat
2021/07/16 Java/Android
继承Win10缺点!教你关闭Win11烦人的网络搜索
2021/11/23 数码科技
SpringBoot中使用Redis作为全局锁示例过程
2022/03/24 Java/Android
go goth封装第三方认证库示例详解
2022/08/14 Golang