这是一个简单的前台短信验证码功能 ajax实现异步处理 (发送和校验)
<script type="text/javascript"> var InterValObj; //timer变量,控制时间 var count = 60; //间隔函数,1秒执行 var curCount;//当前剩余秒数 function sendMessage() { curCount = count; // 设置button效果,开始计时 document.getElementById("btnSendCode").setAttribute("disabled","true" );//设置按钮为禁用状态 document.getElementById("btnSendCode").value="请在" + curCount + "后再次获取";//更改按钮文字 InterValObj = window.setInterval(SetRemainTime, 1000); // 启动计时器timer处理函数,1秒执行一次 // 向后台发送处理数据 $.ajax({ type: "POST", // 用POST方式传输 dataType: "text", // 数据格式:JSON url: "forgetPasswdServlet", // 目标地址 data: "flag=2", success: function (data){ data = parseInt(data, 10); if(data == 1){ $("#jbPhoneTip").html("<font color='#339933'>√ 短信验证码已发到您的手机,请查收</font>"); }else if(data == 0){ $("#jbPhoneTip").html("<font color='red'>× 短信验证码发送失败,请重新发送</font>"); } } }); } //timer处理函数 function SetRemainTime() { if (curCount == 0) { window.clearInterval(InterValObj);// 停止计时器 document.getElementById("btnSendCode").removeAttribute("disabled");//移除禁用状态改为可用 document.getElementById("btnSendCode").value="重新发送验证码"; }else { curCount--; document.getElementById("btnSendCode").value="请在" + curCount + "秒后再次获取"; } } //验证短信验证码 function doCompare(){ var codelast = document.getElementById("codelast").value;//获取输入的验证码 if(codelast == null || codelast == ''){ alert("验证码不能为空!"); }else{ $.ajax({ type: "POST", // 用POST方式传输 dataType: "text", // 数据格式:JSON url: "forgetPasswdServlet", // 目标地址 data: "flag=4&codelast="+codelast, success: function (data){ data = parseInt(data, 10); if(data == 1){ window.location.href='/aoyi/forgetpasswd/forgetpasswd3.jsp';//验证成功 }else if(data == 0){ $("#jbPhoneTip").html("<font color='red'>×短信验证码不正确请重新输入</font>"); }else if(data ==2){ $("#jbPhoneTip").html("<font color='red'>×验证码已失效请重新获取验证码</font>"); } } }); } } </script>
这是一个简单的前台短信验证码功能 ajax实现异步处理 (发送和校验)的更多相关文章
- 四:java调接口实现发送手机短信验证码功能
1.点击获取验证码之前的样式: 2.输入正确的手机号后点击获取验证码之后的样式: 3.如果手机号已经被注册的样式: 4.如果一个手机号一天发送超过3次就提示不能发送: 二:前台的注册页面的代码:reg ...
- Java调用WebService接口实现发送手机短信验证码功能,java 手机验证码,WebService接口调用
近来由于项目需要,需要用到手机短信验证码的功能,其中最主要的是用到了第三方提供的短信平台接口WebService客户端接口,下面我把我在项目中用到的记录一下,以便给大家提供个思路,由于本人的文采有限, ...
- SpringSceurity(4)---短信验证码功能实现
SpringSceurity(4)---短信验证码功能实现 有关SpringSceurity系列之前有写文章 1.SpringSecurity(1)---认证+授权代码实现 2.SpringSecur ...
- jQuery实现倒计时重新发送短信验证码功能示例
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Android Studio精彩案例(五)《JSMS短信验证码功能实现》
转载本专栏文章,请注明出处,尊重原创 .文章博客地址:道龙的博客 很多应用刚打开的时候,让我们输入手机号,通过短信验证码来登录该应用.那么,这个场景是怎么实现的呢?其实是很多开放平台提供了短信验证功能 ...
- 利用WeX5给手机APP增加短信验证码功能
帖子来源:http://bbs.wex5.com/thread-70908-1-1.html 遇到一个手机APP项目客户要求注册到APP上的用户手机号必须是真实的通过X5平台整合短信发送平台接口完成了 ...
- java + maven 实现发送短信验证码功能
如何使用java + maven的项目环境发送短信验证码,本文使用的是榛子云短信 的接口. 1. 安装sdk 下载地址: http://smsow.zhenzikj.com/doc/sdk.html ...
- Java加腾讯云实现短信验证码功能
一.概要 现如今在日常工作和生活中短信验证码对于我们来说是非常熟悉的,比较常见的注册账号或者交易支付时候,手机会收到一个短信验证码,我们可以通过验证码来有效验证身份,避免一些信息被盗. 验证身份 目前 ...
- Java演示手机发送短信验证码功能实现
我们这里采用阿里大于的短信API 第一步:登陆阿里大于,下载阿里大于的SDK a.在阿里大于上创建自己的应用 b.点击配置管理中的验证码,先添加签名,再配置短信模板 第二步:解压相关SDK,第一个为j ...
随机推荐
- ASP.NET Core MVC 控制器创建与依赖注入
本文翻译自<Controller activation and dependency injection in ASP.NET Core MVC>,由于水平有限,故无法保证翻译完全准确,欢 ...
- JavaScript一个cookie存储的类
所有输出都在浏览器的控制台中 <script type="text/javascript"> /** * cookieStorage.js * 本类实现像localSt ...
- JavaScript一个whenReady函数,监听及注册事件
/** * 传递函数给whenReady(),当文档解析完成且为操作准备就绪时, * 函数将作为文档对象的方法调用 * DOMContentLoaded.readystatechange或load事件 ...
- Java 9 揭秘(11. Java Shell)
Tips 做一个终身学习的人. 在本章节中,主要介绍以下内容: 什么是Java shell JShell工具和JShell API是什么 如何配置JShell工具 如何使用JShell工具对Java代 ...
- [AOP系列]Autofac+Castle实现AOP事务
一.前言 最近公司新项目,需要搭架构进行开发,其中需要保证事务的一致性,经过一番查找,发现很多博文都是通过Spring.Net.Unity.PostSharp.Castle Windsor这些方式实现 ...
- Laravel安装及环境的配置(XAMPP集成开发环境下)
Laravel 使用 Composer 来管理代码依赖.所以,在使用 Laravel 之前,请先确认你的电脑上安装了 Composer. 操作系统为win7: 集成开发环境XAMPP: 第一步:安装C ...
- Struts2从头到脚--学习笔记(自认为比较重要的)
一. Struts2框架介绍 Struts2是一个基于MVC设计模式的Web应用框架,它本质上相当于一个servlet,在MVC设计模式中,Struts2作为控制器(Controller)来建立模型与 ...
- docker~docker-compose和VS解决方案的关系
回到目录 一般地,我们在VS里添加了一个解决方案之后,会更新模块或者业务添加多个api,web项目,这类似于最近说的微服务,而我们的docker-compose与微软件正好有了一种默契,当你为你的解决 ...
- MySQL学习笔记(五):MySQL表级锁和行级锁
一:概述 相对其他数据库而言,MySQL的锁机制比较简单,其最显著的特点是不同的存储引擎支持不同的锁机制.比如,MyISAM和MEMORY存储引擎采用的是表级锁(table-level locking ...
- HTTP学习
HTTP(HyperText Transfer Protocol)全称"超文本传输协议" HTTP是基于 TCP/IP 协议的应用层协议 现在日常使用版本 HTTP/1.1 一个H ...