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插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 jQuery
Mui使用jquery并且使用点击跳转新窗口的实例
Aug 19 jQuery
jQuery简单实现对数组去重及排序操作实例
Oct 31 jQuery
jQuery除指定区域外点击任何地方隐藏DIV功能
Nov 13 jQuery
webpack写jquery插件的环境配置
Dec 21 jQuery
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
Jun 14 jQuery
深入浅析angular和vue还有jquery的区别
Aug 13 jQuery
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
May 04 jQuery
jQuery实现动态生成年月日级联下拉列表示例
May 11 jQuery
jquery ajax 请求小技巧实例分析
Nov 11 jQuery
jQuery实现聊天对话框
Feb 08 jQuery
JQuery插件tablesorter表格排序实现过程解析
May 28 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生成sitemap.xml地图函数
2013/11/13 PHP
destoon文章模块调用企业会员资料的方法
2014/08/22 PHP
PHP实现动态柱状图改进版
2015/03/30 PHP
PHP类的声明与实例化及构造方法与析构方法详解
2016/01/26 PHP
ajax调用返回php接口返回json数据的方法(必看篇)
2017/05/05 PHP
PHP简单实现循环链表功能示例
2017/11/10 PHP
jqPlot Option配置对象详解
2009/07/25 Javascript
不同浏览器对回车提交表单的处理办法
2010/02/13 Javascript
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
Javascript的时间戳和php的时间戳转换注意事项
2013/04/12 Javascript
Svg.js实例教程及使用手册详解(一)
2016/05/16 Javascript
类似于QQ的右滑删除效果的实现方法
2016/10/16 Javascript
javascript实现页面滚屏效果
2017/01/17 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
vue better scroll 无法滚动的解决方法
2018/06/07 Javascript
angularjs http与后台交互的实现示例
2018/12/21 Javascript
7个好用的JavaScript技巧分享(译)
2019/05/07 Javascript
JavaScript实现留言板案例
2020/03/17 Javascript
让IDE识别webpack的别名alias的实现方法
2020/05/06 Javascript
使用Python的Twisted框架实现一个简单的服务器
2015/04/16 Python
Python读写txt文本文件的操作方法全解析
2016/06/26 Python
Python实现两款计算器功能示例
2017/12/19 Python
Pandas:DataFrame对象的基础操作方法
2018/06/07 Python
python 搭建简单的http server,可直接post文件的实例
2019/01/03 Python
结合OpenCV与TensorFlow进行人脸识别的实现
2019/10/10 Python
HTML最新标准HTML5总结(必看)
2016/06/13 HTML / CSS
Champion澳大利亚官网:美国冠军运动服装
2018/05/07 全球购物
超市端午节活动方案
2014/01/23 职场文书
幸福家庭事迹材料
2014/02/03 职场文书
医院信息公开实施方案
2014/05/09 职场文书
党员作风建设自查报告
2014/10/23 职场文书
安全承诺书
2015/01/19 职场文书
财务经理岗位职责
2015/01/31 职场文书
CSS实现漂亮的时钟动画效果的实例代码
2021/03/30 HTML / CSS
python OpenCV学习笔记
2021/03/31 Python
Python实现列表拼接和去重的三种方式
2021/07/02 Python