点击按钮发送短信验证码

如何在jsp页面,点击按钮发送短信验证码,并且按钮会倒计时,

你搜索一下 阿里大于。比较方便。

一般是后台发送短信验证码,前端jsp页面只需向后台发送请求,计时可以用 js setTimeout方法

ajax调用阿里大鱼的发送短信的代码代码

 $(":button.getcode").click(function(){  
        var reg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;   
        if(!reg.test($("#mobile").val())){  
            $('#profile .error_mobile').css('display', 'inline');  
            return false;  
        }else{  
            $('#profile .error_mobile').hide();  
        }  
        var countdown = 60;  
        var _this = $(this);  
        //设置button效果,开始计时  
        _this.attr("disabled", "true");  
        _this.val(countdown + "秒后重新获取");  
        //启动计时器,1秒执行一次  
        var timer = setInterval(function(){  
            if (countdown == 0) {                  
                clearInterval(timer);//停止计时器  
                _this.removeAttr("disabled");//启用按钮  
                _this.val("重新发送验证码");  
            }  
            else {  
                countdown--;  
                _this.val(countdown + "秒后重新获取");  
            }  
        }, 1000);  
        $.ajax({  
            type : 'POST',  
            url : '<%=path%>/user/sendCaptchas',  
            dataType : 'json',  
            data : {'stype':'3','ctype':'1','mobile':$("#mobile").val()},  
            success : function(data) {  
                if(data.errorInfo.errorCode==''){  
                    /* alert("短信发送成功"); */  
                }else{  
                    alert(data.errorInfo.errorCode);  
                }  
            }  
        });  
        return false;  
    });  

短信部分看你用谁家的接口,在后台调用即可,前台当输入完手机号后,将手机号传递给后台,进行发送短信,可以在成功后返回,在ajax处理函数中
调用setInterval进行倒计时,如果要防止刷新页面后倒计时消失,可以利用cookie进行操作。

准确的说与 jsp,asp,php 页面无关,前台主要动作是html javascript 控制的动作,发短信则可以用jquery发起跨域请求即可调用第三方SMS系统完成发送动作即可。

 <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.11.0.min.js"></script>
<title>Insert title here</title>
</head>
<body>
    <input type="text" id="phone"/>
    <input type="button" id="btn" value="免费获取验证码" onclick="settime(this),send()" /> 
    <script type="text/javascript">
        function send(){
            $.ajax({
                url:"sendMessage.action",
                type:"POST",
                data:"phone="+$("#phone").val(),
                success:function(msg){
                    alert("返回了"+msg);
                }
            });
        }
        var countdown=60;
        function settime(val) { 
            if (countdown == 0) { 
                val.removeAttribute("disabled"); 
                val.value="免费获取验证码"; 
                countdown = 60; 
            } else { 
                val.setAttribute("disabled", true); 
                val.value="重新发送(" + countdown + ")"; 
                countdown--; 
            } 
            setTimeout(function() { 
                settime(val) },1000)} 
    </script> 
</body>
</html>

jsp是这样实现的,后台调用第三方的短信发送接口,我觉得是这样的。

点击按钮发送请求到后台代码发送短信,,前端,while循环倒计时就行了