在做项目的时候,经常遇到发短信验证码的问题,这时候需要用户点完发送验证码按钮后,一段时间内不能重复点击,毕竟验证码都是收费的嘛,谁都不想浪费,那么如何实现这种功能呢?下面来分享一下。
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
实例代码记录:
- <script type="text/javascript">
- function start_sms_button(obj) {
- var count = 1;
- var sum = 30;
- var i = setInterval(function() {
- if (count > 10) {
- obj.attr('disabled', false);
- obj.val('发送验证码');
- clearInterval(i);
- } else {
- obj.val('剩余' + parseInt(sum - count) + '秒');
- }
- count++;
- },
- 1000);
- }
- $(function() {
- //发送验证码
- $('#send_sms').click(function() {
- var phone_obj = $('input[name="phone"]');
- var send_obj = $('input#send_sms');
- var val = phone_obj.val();
- if (val) {
- if (IsMobile(val)) {
- send_obj.attr('disabled', "disabled");
- //30秒后重新启动发送按钮
- start_sms_button(send_obj);
- $.ajax({
- url: '{#url_reset("index/sms")#}',
- data: {
- 'mobile': val
- },
- dataType: 'json',
- type: 'post',
- beforeSend: function() {
- show_loading_body();
- },
- complete: function() {
- show_loading_body();
- },
- success: function(data) {
- if (data.status != undefined && (data.status == 'ok' || data.status == 'error')) {
- showMsg(data.msg);
- }
- }
- });
- } else {
- showMsg("手机号的格式错误");
- }
- } else {
- showMsg('手机号不能为空');
- }
- });
- });
- </script>
来源: