jsp部分：是一个普通的<input>标签
<input type="tel" name="unumber"id="phone" placeholder="请输入手机号" >
<input type="tel" name="input_code" id="code" placeholder="请输入验证码" >
<input type="button"style=" border-radius: 5px;width: 100%; height: 100%; text-align: center; padding-left: 2px"id="getCode" value="获取" οnclick="sendCode(this)">
js部分：
// 点击获取，进入倒计时，按序号进行 clock = '';nums = 60;btn = null;function time(thisBtn) {//③time()函数处理“获取”按钮btn = thisBtn;btn.disabled = true; // 将按钮置为不可点击btn.value = nums + '秒后可重新获取';//让按钮显示倒计时clock = setInterval(doLoop, 1000); // ④setInterval（arg1，arg2）为定时器，arg1为执行哪个函数，arg2为多久执行一次（单位毫秒），}function doLoop() {nums--;if (nums > 0) {btn.value = nums + '秒后可重新获取';} else {//如果倒数计时结束，就清除定时器，将按钮状态改为可点击，并将按钮值显示为“重新发送”，最后重置倒计时时间60秒。clearInterval(clock); // 清除js定时器btn.disabled = false;btn.value = '重新发送验证码';nums = 60; // 重置时间}}function sendCode(ele) {// ①点击出发函数，进入后台发送验证码$.ajax({url : "UserServlet?operation=send",data : {"phone" : $("#phone").val()},type : "post",async : true,success : function(data) {//成功回调函数，失败不调用！time(ele);//②发送成功后，调用函数time（）；},});}
后台java代码：
// 向用户手机号发送验证码，并保存在session域中，方便进行验证此验证码是否输入正确。
public void send(HttpServletRequest request, HttpServletResponse response) {String phone = request.getParameter("phone");try {String code = SendMessage.sendMess(phone);//此处为自己封装的sendMess（）方法，获取验证码，见下面。request.getSession().setAttribute("code", code);} catch (Exception e1) {// TODO Auto-generated catch blocktry {response.getWriter().write("发送失败了");} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();}}try {response.getWriter().write("发送成功");} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();}}
//此处用的是网易云短信服务，本段代码可直接拷贝使用，需更改相应账号、秘钥、以及短信id，也可自行参考网易云短信开发手册。
public class SendMessage { //发送验证码的请求路径URLprivate static final StringSERVER_URL="ease.im/sms/sendcode.action";//网易云信分配的账号，请替换你在管理后台应用下申请的Appkeyprivate static final StringAPP_KEY="545ab725fbfe94fa3585bf24ba18a889";//网易云信分配的密钥，请替换你在管理后台应用下申请的appSecretprivate static final String APP_SECRET="5862f3168049";//随机数private static final String NONCE="123456";//短信模板IDprivate static final String TEMPLATEID="3094133";//手机号//private static final String MOBILE="13812186059";//验证码长度，范围4～10，默认为4private static final String CODELEN="4";public static String sendMess(String phone) throws Exception {DefaultHttpClient httpClient = new DefaultHttpClient();HttpPost httpPost = new HttpPost(SERVER_URL);String curTime = String.valueOf((new Date()).getTime() / 1000L);/** 参考计算CheckSum的java代码，在上述文档的参数列表中，有CheckSum的计算文档示例*/String checkSum = CheckSumBuilder.getCheckSum(APP_SECRET, NONCE, curTime);// 设置请求的headerhttpPost.addHeader("AppKey", APP_KEY);httpPost.addHeader("Nonce", NONCE);httpPost.addHeader("CurTime", curTime);httpPost.addHeader("CheckSum", checkSum);httpPost.addHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");// 设置请求的的参数，requestBody参数List<NameValuePair> nvps = new ArrayList<NameValuePair>();/** 1.如果是模板短信，请注意参数mobile是有s的，详细参数配置请参考“发送模板短信文档”* 2.参数格式是jsonArray的格式，例如 "['13888888888','13666666666']"* 3.params是根据你模板里面有几个参数，那里面的参数也是jsonArray格式*/nvps.add(new BasicNameValuePair("templateid", TEMPLATEID));nvps.add(new BasicNameValuePair("mobile", phone));nvps.add(new BasicNameValuePair("codeLen", CODELEN));httpPost.setEntity(new UrlEncodedFormEntity(nvps, "utf-8"));// 执行请求HttpResponse response = httpClient.execute(httpPost);/** 1.打印执行结果，打印结果一般会200、315、403、404、413、414、500* 2.具体的code有问题的可以参考官网的Code状态表*** {"code":200,"msg":"1","obj":"8588"}*/String result = EntityUtils.toString(response.getEntity(), "utf-8");//将输出结果进行解析，获取发送出去的验证码，例如上述中的“8588”。String[] results = result.split(":");String _result =results[3].substring(1, 5);return _result;}}
