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源码】
Mar 28 jQuery
jQuery实现鼠标滑过预览图片大图效果的方法
Apr 26 jQuery
jQuery插件开发发送短信倒计时功能代码
May 09 jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 jQuery
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
jQuery实现QQ空间汉字转拼音功能示例
Jul 10 jQuery
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
JS秒杀倒计时功能完整实例【使用jQuery3.1.1】
Sep 03 jQuery
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 jQuery
jquery实现烟花效果(面向对象)
Mar 10 jQuery
jQuery 实现扁平式小清新导航
Jul 07 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 session_start()问题解疑(详细介绍)
2013/07/05 PHP
php判断页面是否是微信打开的示例(微信打开网页)
2014/04/25 PHP
汇总PHPmailer群发Gmail的常见问题
2016/02/24 PHP
PHP使用curl函数发送Post请求的注意事项
2016/11/26 PHP
PHP实现负载均衡下的session共用功能
2018/04/17 PHP
解决laravel groupBy 对查询结果进行分组出现的问题
2019/10/09 PHP
Laravel获取当前请求的控制器和方法以及中间件的例子
2019/10/11 PHP
Yii框架学习笔记之应用组件操作示例
2019/11/13 PHP
PHP如何防止用户重复提交表单
2020/12/09 PHP
解决FireFox下[使用event很麻烦]的问题
2006/11/26 Javascript
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
2010/05/24 Javascript
js判断FCKeditor内容是否为空的两种形式
2013/05/14 Javascript
jQuery中parents()和parent()的区别分析
2014/10/28 Javascript
DOM节点删除函数removeChild()用法实例
2015/01/12 Javascript
jQuery实现tab选项卡效果的方法
2015/07/08 Javascript
简述jQuery ajax的执行顺序
2016/01/05 Javascript
JavaScript实现复制文章自动添加版权
2016/08/02 Javascript
Javascript动画效果(2)
2016/10/11 Javascript
Node.js常用工具之util模块
2017/03/09 Javascript
JavaScript实现计算圆周率到小数点后100位的方法示例
2018/05/08 Javascript
浅谈React碰到v-if
2018/11/04 Javascript
详解如何使用node.js的开发框架express创建一个web应用
2018/12/20 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
2019/03/19 Javascript
vue实现侧边栏导航效果
2019/10/21 Javascript
如何在vue中使用HTML 5 拖放API
2021/01/14 Vue.js
使用python调用浏览器并打开一个网址的例子
2014/06/05 Python
查看Python安装路径以及安装包路径小技巧
2015/04/28 Python
Python在Console下显示文本进度条的方法
2016/02/14 Python
Python 转义字符详细介绍
2017/03/21 Python
python判断文件夹内是否存在指定后缀文件的实例
2019/06/10 Python
美国最大的农村生活方式零售店:Tractor Supply Company(TSC)
2017/05/15 全球购物
de Bijenkorf比利时官网:荷兰最知名的百货商店
2017/06/29 全球购物
大学生未来职业生涯规划书
2014/02/15 职场文书
优秀实习生主要事迹
2014/05/29 职场文书
音乐教师个人工作总结
2015/02/06 职场文书
员工表扬信怎么写
2015/05/05 职场文书