常用jquery备份

最新推荐文章于 2025-06-27 10:48:09 发布

锅盖头-jack

最新推荐文章于 2025-06-27 10:48:09 发布

阅读量626

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/a3197588/article/details/18546927

这篇博客详细介绍了使用jQuery实现找回密码的功能，包括手机号验证、发送短信验证码的逻辑和前端倒计时处理。同时，它也提到了jQuery AJAX在处理数据交互时的便捷性，并给出了get和post方式的使用示例，以及如何处理返回的JSON数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

第一章找回密码

jquery 找回密码思路---通过输入手机号，发送短信验证码：

①首先 js判断用户电话是否为空、

②判断data('locked')是否是true（如果是则返回false）

③设置data('locked',true)

④手机号发送到后台（1）首先获取到关于手机发送验证码的所有session的信息、判断是否为空，或者是否是标准的手机号（2）判断是否绑定了、（3）判断是否在时间控制范围内（4）发送短信（如果成功了,把用户电话、验证码、时间存入session中（用于前面的时间判断）之后返回ok 否则返回错误的相关信息）

⑤前台js判断返回的是否是ok 如果是ok 修改提示消息，同时给一个time值（用于给用户提示时间），之后循环（用于限制用户不能频繁的点击获取验证码）循环的时候判断是否是time是否是<=0的如果是data('locked',false);修改显示倒计时的地方、清除循环clearInterval(); 如果没有<=0 给一个倒计时显示 time--; 这样还有一个bug就是如果用户刷新了，又可以发送短信了所以后台要控制好（session中时间的设置和判断）。

⑥当用户手机获取到验证码之后输入验证码（输入次数限制）后台限制

具体代码如下：

js：

php：

/**
       * 忘记密码   手机获取验证码
       */
       public function getVrifi(){
           $time = time();
           $phoneCode = session('phone_code'); //保存在session中的验证码
           $phone = $_POST['phone'];
           empty($phone) ? exit('密码不能为空') : $phone;
           if(!preg_match('/^1[3458]\d{9}$/', $phone)){
               exit('请输入正确的手机号码');
           }
           if($phoneCode[$phone]['send_time'] > $time) exit('请勿频繁获取手机验证码');
           //根据用户电话查询用户信息
           $user = model('User')->where(array('phone'=>$phone))->find();
           if(is_null($user) || empty($user)) exit('手机未绑定');
           $phoneCode[$phone]['send_time'] = $time + 120;
           $code = rand(100000,999999);//手机验证码
           $phoneCode[$phone]['code'] = md5($code);
           $txt = '您本次获取的验证码是'.$code.'请在页面指定处填写。如非本人操作，请忽略此信息';
           if(sendSms($phone,$txt)){
               session('phone_code',$phoneCode); //相关信息保存session 时间的控制
               exit('ok');
           }else{
               exit('发送失败');
           }
       }

/**
       * 检查验证码是否正确
       *
       */
       public function checkCode(){
           $phone = $_POST['phone'];
           $code = md5($_POST['code']);
           $phone = empty($phone) ? exit('手机号不能为空') : $phone;
           $phoneCodes = session('phone_code');
           //常规检查用户信息
           if(!empty($phone)){
               if(!preg_match('/^1[3458]\d{9}$/', $phone)){
                   exit('异常操作');
               }
           }
           //检查用户信息
           if(!isset($phoneCodes[$phone]) || empty($phoneCodes[$phone])){
               exit('请先获取验证码');
           }
           $phoneCode = $phoneCodes[$phone];
           if($code !== $phoneCode['code']){
               $phoneCode['err'] += 1;
               if($phoneCode['err'] >= 4){
                   $phoneCodes[$phone] = null;
                   session('phone_code',$phoneCodes);
                   exit('请重新获取短信验证码');
               }else{
                   $phoneCodes[$phone] = $phoneCode;
                   session('phone_code', $phoneCodes);
                   exit('验证码错误，你还可以尝试'.(4-$phoneCode['err']).'次');
               }
           }else{
               exit('ok');
           }
       }

jquery中的ajax不像本身的ajax 还要去考虑兼容问题。所以我还是比较喜欢jquery的方式。

第二章 jquery中的ajax

① get方式：

$.get("url",'info',function(data){..............}); //url 是数据要提交给的控制器的地址，info是提交的数据，function是数据传输回来之后要执行的回调函数.其中data是控制器提交给前台的数据。

把数据提交给index.php控制器做处理。

eg：

如果传递的是变量的话可以用{recom : $('#id').val()} 不能用双引号包围，双引号是字符串处理了。

location.reload() 是刷新页面

②post方式：post方式和get方式一样的

③ajax方式：

eg 用实例说话：

具体的参考可以看看在线手册

另外：前台处理返回的json数据处理：

var data = eval("("+data+")")或者是var data = $.parseJSON(data);

在jquery中ajax 之后的function当中 $(this) 没有作用解决办法：在提交之前把$(this) 赋给一个变量，用变量来解决。

append中无法获取clone 之后的数据值。则可以使用live来解决。

添加地址栏上面的图标

ico图标
在<head>与</head>之间加入代码
<link rel=”shortcut icon” href=”favicon.ico”>

注意：

1、图标文件名必须是favicon.ico

2、favicon.ico文件必须放到网站的根目录下

3、favicon.ico文件大小为16*16

判断密码强度

//密码输入强度,鼠标按下时判断
$(".log_username").keyup(function(){
var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "gi");
var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z]) (?=.*[0-9]))).*$", "gi");
var enoughRegex = new RegExp("(?=.{6,}).*", "gi");
if (false == enoughRegex.test($(this).val())) {
$('.rst-mm').find('i').removeClass();
$('#passstrength').html('弱'); //密码小于六位的时候，密码强度图片都为灰色
}else if (strongRegex.test($(this).val())) {
$('.rst-mm').find('i').addClass('current');
$('#passstrength').html('强'); //密码为八位及以上并且字母数字特殊字符三项都包括
}else if (mediumRegex.test($(this).val())) {
$('.rst-mm').find('i').addClass('current').last().removeClass();
$('#passstrength').html('中'); //密码为七位及以上并且字母、数字、特殊字符三项中有两项，强度是中等
}else {
$('.rst-mm').find('i').first().addClass('current').siblings('i').removeClass(); //如果密码为6为及以下，就算字母、数字、特殊字符三项都包括，强度也是弱的
$('#passstrength').html('弱');
}
return true;
});