ava調用WebService接口實現發送手機短信驗證碼功能
二：前臺的註冊頁面的代碼：reg.jsp javascript
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@page import="cn.gov.csrc.base.action.FindAllData"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>中國證券會證券期貨違法違規舉報中心-註冊</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="shortcut icon" type="image/x-icon" href="<%=request.getContextPath()%>/images/favicon.ico" />
<link rel="stylesheet" type="text/css"
href="<%=request.getContextPath()%>/css/main.css">
<link
href="<%=request.getContextPath()%>/formValidator1/style/validator.css"
rel="stylesheet" type="text/css" />
<style type="text/css">
button {
background: #F0F0F0 repeat-x;
padding-top: 3px;
border-top : 1px solid #708090;
border-right: 1px solid #708090;
border-bottom: 1px solid #708090;
border-left: 1px solid #708090;
width: auto;
line-height: 12pt;
font-size : 10pt;
cursor: hand;
font-size: 10pt;
border-top: 1px solid #708090;
}
</style>
<script src="<%=request.getContextPath()%>/js/jquery-1.7.2.min.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/formValidator1/formValidator-4.0.1.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/formValidator1/formValidatorRegex.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/js/register.js"
type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/js/sms.js"
type="text/javascript"></script>
<script type="text/javascript">
function changeCheckNum() {
var checkNumImage_ = document.getElementById("checkNumImage");
checkNumImage_.src = "${pageContext.request.contextPath}/image.jsp?timeStamp="+ new Date().getTime();
}
</script>
<script type="text/javascript">
var msg = "${message}";
if (msg != "") {
alert(msg);
}
</script>
</head>
<body>
<%@include file="/statics/top.jspf"%>
<div class="center_division">
<div class="center_body">
<div class="center_menu">
<font color="#000000">當前位置：</font>
<a href="<%=request.getContextPath()%>/statics/reg.jsp"><font color="#000000">用戶註冊</font></a>
</div>
</div>
<div class="center_body_menu">
<s:form action="RegisterAction_register" id="form1" name="form1" method="post" namespace="/">
<table id="tb">
<tr>
<td colspan="3" align="center" bgcolor="#DDDFE1">舉報人基本信息</td>
</tr>
<tr>
<td align="center" width="30%"> <img src="images/new_reg_xing.gif"/>用戶名：</td>
<td align="center" width="40%">
<s:textfield name="username" id="username" cssStyle="width:160px;height:24px;" onblur="checkusername()"/>
</td>
<td align="left" width="30%">
<span id="usernameTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>username</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>登陸密碼：</td>
<td align="center" width="40%">
<s:password name="password" id="password" cssStyle="width:160px;height:24px;" onblur="checkpassword()"/>
</td>
<td align="left" width="30%">
<span id="passwordTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>password</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>確認密碼：</td>
<td align="center" width="40%">
<s:password name="passwordRepeat" id="passwordRepeat" cssStyle="width:160px;height:24px;" onblur="checkpasswrodb()"/>
</td>
<td align="left" width="30%">
<span id="passwordRepeatTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>passwordRepeat</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>姓 名：</td>
<td align="center" width="40%">
<s:textfield name="nickname" id="nickname" cssStyle="width:160px;height:24px;" onblur="checknickname()"/>
</td>
<td align="left" width="30%">
<span id="nicknameTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>nickname</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%">性 別：</td>
<td align="center" width="40%">
<s:radio list="#application.dataMap.get('10001')" name="jbSex" cssStyle="height:24px;"/>
</td>
<td align="left" width="30%"></td>
</tr>
<tr>
<td align="center" width="30%">聯繫地址：</td>
<td align="center" width="40%">
<s:textfield name="jbAddress" id="jbAddress" cssStyle="width:160px;height:24px;" />
</td>
<td align="left" width="30%">
<span id="jbAddressTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbAddress</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>聯繫手機：</td>
<td align="center" width="40%">
<s:textfield id="jbPhone" name="jbPhone" cssStyle="width:160px;height:24px;" onblur="checkjbPhone()"/>
</td>
<td align="left" width="30%">
<span id="jbPhoneTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbPhone</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center"><img src="images/new_reg_xing.gif"/>短信驗證碼：</td>
<td align="left" colspan="2" style="padding-left: 112px;">
<s:textfield id="SmsCheckCode" name="SmsCheckCode" cssStyle="width:80px;height:24px;" maxLength="6" />
<span><input type="button" id="btnSendCode" name="btnSendCode" value="免費獲取驗證碼" onclick="sendMessage()" /></span>
<span id="SmsCheckCodeTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>SmsCheckCodeTip</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>證件類型：</td>
<td align="center" width="40%">
<s:select list="#application.dataMap.get('10002')" label=""
headerKey="" headerValue="--請選擇--" value="1" listValue="value" onchange="enableCredentialsCode(this)"
name="jbCredentialsName" id="jbCredentialsName" cssStyle="width:160px;height:24px;"/>
</td>
<td align="left" width="30%">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbCredentialsName</s:param>
</s:fielderror>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>證件號碼：</td>
<td align="center" width="40%">
<s:textfield name="jbCredentialsCode" id="jbCredentialsCode" cssStyle="width:160px;height:24px;" onblur="checkjbCredentialsCode()"/>
</td>
<td align="left" width="30%">
<span id="jbCredentialsCodeTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbCredentialsCode</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%">單位名稱：</td>
<td align="center" width="40%">
<s:textfield name="jbCompanyName" id="jbCompanyName" cssStyle="width:160px;height:24px;" />
</td>
<td align="left" width="30%">
<span id="jbCompanyNameTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbCompanyName</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"><img src="images/new_reg_xing.gif"/>所在地區：</td>
<td align="center" width="40%">
<s:select list="#application.dataMap.get('10003')" label=""
headerKey="" headerValue="--請選擇--" listKey="key"
cssStyle="width:160px;height:24px;" listValue="value" id="jbSourceArea"
name="jbSourceArea" onblur="checkjbSourceArea()"/>
</td>
<td align="left" width="30%">
<span id="jbSourceAreaTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>jbSourceArea</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td align="center" width="30%"> <img src="images/new_reg_xing.gif"/>驗證碼：</td>
<td align="center" width="40%">
<s:textfield id="checkNum" name="checkNum" cssStyle="width:60px;height:24px;" onblur="checkNumber()" maxLength="4"/>
<img id="checkNumImage" src="${pageContext.request.contextPath}/image.jsp">
<a onClick="changeCheckNum()" title="點擊換一張" style="cursor:hand;"> 換一張</a>
</td>
<td align="left" width="30%">
<span id="checkNumTip">
<s:fielderror cssStyle="color:red;padding-left:10px;">
<s:param>checkNumTip</s:param>
</s:fielderror>
</span>
</td>
</tr>
<tr>
<td colspan="3" style="vertical-align: top; padding-top: 5px;padding-bottom: 5px;">
<input type="submit" value="註冊" style="width:50px; height:24px;"/>
<input type="reset" value="重置" style="width:50px; height:24px;"/>
</td>
</tr>
</table>
</s:form>
</div>
</div>
<%@include file="/common/buttom.jspf"%>
</body>
</html>
三:前臺獲取短信驗證碼的js：sms.jscss
var InterValObj; //timer變量，控制時間
var count = 120; //間隔函數，1秒執行
var curCount;//當前剩餘秒數
var code = ""; //驗證碼
var codeLength = 6;//驗證碼長度
function sendMessage() {
curCount = count;
var jbPhone = $("#jbPhone").val();
var jbPhoneTip = $("#jbPhoneTip").text();
if (jbPhone != "") {
if(jbPhoneTip == "√ 該手機號碼能夠註冊，輸入正確" || jbPhoneTip == "√ 短信驗證碼已發到您的手機,請查收"){
// 產生驗證碼
for ( var i = 0; i < codeLength; i++) {
code += parseInt(Math.random() * 9).toString();
}
// 設置button效果，開始計時
$("#btnSendCode").attr("disabled", "true");
$("#btnSendCode").val("請在" + curCount + "秒內輸入驗證碼");
InterValObj = window.setInterval(SetRemainTime, 1000); // 啓動計時器，1秒執行一次
// 向後臺發送處理數據
$.ajax({
type: "POST", // 用POST方式傳輸
dataType: "text", // 數據格式:JSON
url: "UserAction_sms.action", // 目標地址
data: "jbPhone=" + jbPhone +"&code=" + code,
error: function (XMLHttpRequest, textStatus, errorThrown) {
},
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>");
}else if(data == 2){
$("#jbPhoneTip").html("<font color='red'>× 該手機號碼今天發送驗證碼過多</font>");
}
}
});
}
}else{
$("#jbPhoneTip").html("<font color='red'>× 手機號碼不能爲空</font>");
}
}
//timer處理函數
function SetRemainTime() {
if (curCount == 0) {
window.clearInterval(InterValObj);// 中止計時器
$("#btnSendCode").removeAttr("disabled");// 啓用按鈕
$("#btnSendCode").val("從新發送驗證碼");
code = ""; // 清除驗證碼。若是不清除，過期間後，輸入收到的驗證碼依然有效
}else {
curCount--;
$("#btnSendCode").val("請在" + curCount + "秒內輸入驗證碼");
}
}
$(document).ready(function() {
$("#SmsCheckCode").blur(function() {
var SmsCheckCodeVal = $("#SmsCheckCode").val();
// 向後臺發送處理數據
$.ajax({
url : "UserAction_checkCode.action",
data : {SmsCheckCode : SmsCheckCodeVal},
type : "POST",
dataType : "text",
success : function(data) {
data = parseInt(data, 10);
if (data == 1) {
$("#SmsCheckCodeTip").html("<font color='#339933'>√ 短信驗證碼正確，請繼續</font>");
} else {
$("#SmsCheckCodeTip").html("<font color='red'>× 短信驗證碼有誤，請覈實後從新填寫</font>");
}
}
});
});
});
相關文章
- 1. Java調用WebService接口實現發送手機短信驗證碼功能，java 手機驗證碼，WebService接口調用...
- 2. Java調用WebService接口實現發送手機短信驗證碼功能，java 手機驗證碼，WebService接口調用
- 3. Java實現發送手機驗證碼功能（短信+語音）
- 4. 手機短信驗證功能實現
- 5. Java實現發送短信驗證驗證碼功能(下篇)
- 6. 短信接口調用-手機短信，驗證碼
- 7. php手機短信接口發送驗證碼
- 8. 發送手機短信獲取驗證碼功能
- 9. java手機發送短信驗證碼
- 10. PHP 手機短信發送驗證碼
- 更多相關文章...
- • 使用Redis和Lua的原子性實現搶紅包功能 - 紅包項目實戰
- • XML 驗證 - XML 教程
- • Spring Cloud 微服務實戰(三) - 服務註冊與發現
- • ☆基於Java Instrument的Agent實現
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. 字節跳動21屆秋招運營兩輪面試經驗分享
- 2. Java 3 年，25K 多嗎？
- 3. mysql安裝部署
- 4. web前端開發中父鏈和子鏈方式實現通信
- 5. 3.1.6 spark體系之分佈式計算-scala編程-scala中trait特性
- 6. dataframe2
- 7. ThinkFree在線
- 8. 在線畫圖
- 9. devtools熱部署
- 10. 編譯和鏈接
歡迎關注本站公眾號,獲取更多信息
