jquery ajax 請求程式碼示例
阿新 • • 發佈：2019-01-31
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="com.gl.dao.*, com.gl.bean.MobileReg"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!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">
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0">
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<title>我的邀請</title>
<link href="css/style-phone.css" rel="stylesheet">
<link href="css/grey.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.blockUI.js"></script>
<script src="public/new/js/jquery-1.8.3.min.js"></script>
<!--百度地圖取得城市不可省略-->
<script type="text/javascript"
src="http://api.map.baidu.com/api?v=2.0&ak=hEbCHFklzlNWe43gA7gAgxv2"></script>
<script type="text/javascript">
// 百度地圖API功能
var map = new BMap.Map("bdMapBox");
var nowCity = new BMap.LocalCity();
nowCity.get(bdGetPosition);
function bdGetPosition(result) {
//當前的城市名
var cityName = result.name;
/*把城市名傳遞給頁面中的hidden，以便於傳值*/
//atCity.value = cityName;
document.getElementById("atCity").value = cityName;
/*自定義程式碼*/
}
</script>
<!--不可省略-->
</head>
<body>
<div class="container bg-phone" id="bg-phone">
<div class="content">
<div class="logo">
<img src="images/logo.png">
</div>
<s:form method="post" class="sign-form" id="regform">
<br>
<s:set name="backMessage" value="#request.backMessage" />
<div class="row">
<div style="color: #F00">
<h3 id="errorMessage">
<s:if test="#backMessage!=null">
${backMessage}
</s:if>
</h3>
<input type="hidden" id="msg"
value="<s:property value='backMessage' />">
</div>
</div>
<s:set name="backresult" value="#request.backresult" />
<s:if test="#backresult!=null">
<div class="row">
<div style="color: #F00">
<h3>
<input type="hidden" id="backresult"
value="<s:property value='backresult' />">
</h3>
</div>
</div>
</s:if>
<s:set name="sendMsgOk" value="#request.sendMsgOk" />
<s:if test="#sendMsgOk!=null">
<input id="sendMsgOk"
value="<s:property value='sendMsgOk' />">
</s:if>
<div class="sign-group mt10">
<%-- <s:textfield name="MobileReg.mobileNo" placeholder="手機號碼" type="tel" /> --%>
<input name="mobileReg.mobileNo" value="${mobileReg.mobileNo}"
id="mobileNo" type="tel" placeholder="手機號碼" maxlength="11"
onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
<input name="moRadom" value=""
id="moRadom" type="hidden" ></input>
</div>
<div class="sign-group mt10">
<%-- <s:textfield name="MobileReg.password" placeholder="密碼(6位數)" type="password"/> --%>
<input name="mobileReg.password" value="${mobileReg.password}"
id="password" type="password" placeholder="密碼(6位數)" maxlength="6"
onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="sign-group mt10 overf">
<!-- class="red-b"為報錯時新增的樣式 -->
<div class="chack">
<input id="checkSnp" name="mobileReg.checkSnp"
value="${mobileReg.checkSnp}" type="telp" placeholder="影象驗證碼"
maxlength="4" onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="chack-but">
<!-- <input id="submitMobile" type="button" name="button2" value="獲得校驗碼11" > -->
<div id="regshow"><img id="imgregshow" style="width:76px; height:30"></div>
</div>
</div>
<div class="sign-group mt10 overf">
<!-- class="red-b"為報錯時新增的樣式 -->
<div class="chack">
<%-- <s:textfield class="red-b" name="MobileReg.checkSn" placeholder="驗證碼" type="number" /> --%>
<input id="checkSn" name="mobileReg.checkSn"
value="${mobileReg.checkSn}" type="tel" placeholder="驗證碼"
maxlength="6" onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="chack-but">
<!-- <input id="submitMobile" type="button" name="button2" value="獲得校驗碼11" > -->
<input type="button" class="but2" id="chkButtons" style="margin-right:-3px;height:30px;width:77px;" value="獲取驗證碼"></button>
</div>
</div>
<div class="sign-group mt10">
<input id="read_checkbox" type="checkbox" checked /> <span
class="xieyi">我已同意
<a href="javascript:void(0)" id="readagreetext">《給樂生活使用者協議》</a>
<a id="downloadapp">立即下載APP</a>
</span> <br>
<!--不可省略-->
<div id="bdMapBox" style="display: none;"></div>
<div style="color: #F00; display: none;">
<input type="text" id="atCity" name="atCity" value="" />
<%-- 當前所在的城市為：<span id="atCity" ></span> --%>
</div>
<!--不可省略-->
</div>
<div class="sign-group mt10">
<button id="regButton" class="but1">立即註冊</button>
</div>
<input type="hidden" name="mobileReg.city" id="city">
</s:form>
</div>
<!-- class="succwss hid"中的hid為隱藏，當註冊成功時，把hid去掉，便會顯示註冊成功，把hid刪除掉可以看效果-->
<div class="success hid" id="tipsdiv">
<div class="tips">
<h3 id="tipmessage">你已註冊成功，請操作以下步驟</h3>
<div class="sign-group mt10">
<a class="but1" id="downloadurl">下載APP，立刻體驗</a>
</div>
<p>
<!-- <a href="#" id="close">過後再下載</a> -->
<a href="javascript:void(0)" id="close">過後再下載</a>
</p>
</div>
</div>
<div class="success hid" >
<div id="agree_text">
<div style="color: #000;" >
<h3 class="text-center">給樂生活使用者協議</h3>
<div class="sign-group mt10">
<button class="but1" onclick="layer.closeAll();">我已閱讀並瞭解</button>
</div>
<p>本《協議》是您與深圳給樂資訊科技有限公司（下稱“給樂”）及其會員在“給樂網”www.365gl.com（下稱“給樂網”）上關於註冊、使用、管理給樂網賬戶，以及使用給樂網相關服務所訂立的協議。給樂商城及其涉及到的商業模式、產品、商品、服務的所有權和運營權都歸給樂所有。給樂對網站有修改、完善、變更、監督、提示的權利。本協議內容的正文和給樂已經發布的或即將釋出的各種規則、宣告等，都具備同等的法律效力。</p>
<b>一、會員註冊協議:</b>
<p>
1、在接受本協議之前，請您仔細閱讀本協議的全部內容。如果您對本協議的條款有疑問的，請通過客服渠道進行詢問，給樂公司將向您解釋條款內容。<b>如果您不同意本協議的任意內容，或者無法準確理解給樂公司對條款的解釋，請不要同意本協議或使用本協議項下的服務，否則，表示您已接受了以下所述的條款和條件，同意受本協議約束。屆時您不應以未閱讀本協議的內容或者未獲得給樂公司對您問詢的解答等理由，主張本協議無效，或要求撤銷本協議</b>;
</p>
<p>2、您承諾接受並遵守本協議的約定即可註冊成為會員。如果您不同意本協議的約定，您應立即停止註冊程式或停止使用給樂網服務;</p>
<p>
3、<b>給樂網有權根據需要不時地制訂、修改本協議或各類規則，並以網站公示的方式進行公告，不再單獨通知您。變更後的協議和規則一經在網站公佈後，立即自動生效。如您不同意相關變更，應當立即停止使用給樂網服務，如您繼續使用給樂網服務，即表示您接受經修訂的協議。</b>
</p>
<b>二、給樂服務保護條款:</b>
<p>1、
“給樂網”服務僅供依法能夠且有權訂立具有法律約束力合約的自然人、法人及非法人組織使用。因此，使用者應為具備完全民事行為能力的自然人，或依法成立、存續的法人或非法人組織。使用者違反本項條件，“給樂網”可隨時、全權決定拒絕向其提供服務，若因此給“給樂網”或第三方造成損失，使用者承擔全部賠償責任。</p>
<p>2、本站運用自己的作業系統通過國際網際網路絡為會員（使用者）提供網路服務。同時，會員（使用者）必須自行配備上網的所需裝置，包括個人電腦、調變解調器或其它必備上網裝置;自行負擔個人上網所支付的與此服務有關的電話費用、網路費用。基於本站所提供的網路服務的重要性，會員（使用者）應同意提供詳盡、準確的個人資料，並不斷更新註冊資料，使其符合及時、詳盡、準確的要求。本站保證不公開使用者的真實姓名、地址、電子郵箱和聯絡電話等使用者資訊，
除以下情況外： (1)使用者授權本站透露這些資訊。 (2)相應的法律及程式要求本站提供使用者的個人資料。</p>
<p>3、給樂網為會員（使用者）提供合法的、健康的產品及服務，但是會員（使用者）應對其使用“給樂網”自行承擔責任及風險，給樂在任何情況下不就因會員使用或不是“給樂網”提供的服務所發生的特殊的、意外的、直接或間接的損失承擔賠償責任。（1）禁止任何商業目的的註冊。“給樂網”鼓勵以使用為目的換領和換購給樂商品，但禁止一切商業目的和商業行為，若會員（使用者）利用“給樂網”的服務、產品從事任何以商業為目的行為，給樂有權採取取消訂單、凍結或關閉賬戶等措施，給給樂造成的損失，會員（使用者）承擔賠償責任，構成犯罪的，給樂有權提請國家主管部門追究其行政和刑事責任。（2）本站將盡最大努力保證您所購商品與市場上公佈的價格接近。產品的價格和可獲性都在本站上指明，這類資訊將隨時更改。您所換購的商品，如果發生缺貨，會員有權取消定單。</p>
<b>三、給樂網會員使用規則 </b>
<p>1、
特別提示會員（使用者），使用網際網路必須遵守國家有關的政策和法律，包括刑法、國家安全法、保密法、計算機資訊系統安全保護條例等，保護國家利益，保護國家安全，對於違法使用網際網路絡而引起的一切責任，由使用者負全部責任。</p>
<p>2、
會員（使用者）在申請使用“給樂網”提供的網路服務時，必須向給樂提供詳盡準確的個人資料，如個人資料有任何變動，必須及時更新，因資訊有誤導致的損失將由使用者自行承擔。</p>
<p>3、會員（使用者）可在“給樂網”評論及檢視資訊，但不得通過“給樂網”傳送或傳播敏感資訊和違反國家法律法規政策的資訊，此類資訊包括但不限於：（1）
反對憲法所確定的基本原則的；（2） 危害國家安全，洩露國家祕密，顛覆國家政權，破壞國家統一的;（3） 損害國家榮譽和利益的;（4）
煽動民族仇恨、民族歧視，破壞民族團結的； (5） 破壞國家宗教政策，宣揚邪教和封建迷信的；（6）
散佈謠言，擾亂社會秩序，破壞社會穩定的；（7） 散佈淫穢、色情、賭博、暴力、凶殺、恐怖或者教唆犯罪的；（8）
侮辱或者誹謗他人，侵害他人合法權益的；（9） 含有法律、行政法規禁止的其他內容的。</p>
<p>4、會員（使用者）享有檢舉權，會員（使用者）在使用“給樂網”服務過程中若發現違法、違規、侵權或其他任何違反本服務條款的行為，有權通過給樂網客服向給樂進行檢舉，給樂將通過對舉報內容的核實採取相應的措施。會員（使用者）保證其檢舉事項的真實性、公正性，同時尊重給樂對被檢舉事項的處置措施。</p>
<p>
5、<b>會員（使用者）違反本條“使用者使用基本規則”，給樂公司有權視情節的嚴重採取警告、限期改正、暫停服務、取消訂單、禁止交易、封閉帳號、永久禁止註冊等措施，給給樂公司或第三方造成損失的，給樂公司有權採取一切合法的訴訟與非訴手段進行索賠；會員（使用者）行為構成犯罪的，給樂公司有權通知和協助國家主管部門進行查處。</b>
</p>
<p>6、使用者一旦註冊成功，成為本站的合法會員，將得到一個密碼和使用者名稱。會員可隨時根據指示改變您的密碼。會員需謹慎合理的儲存、使用使用者名稱和密碼。會員若發現任何非法使用會員帳號或存在安全漏洞的情況，請立即通知本站和向公安機關報案。</p>
<p>
7、使用“給樂網”服務過程中，會員有義務保管好個人賬號及密碼，並對他人使用私人計算機作出限制。如果因為會員管理不善造成帳號、密碼等被複制或被盜用，相應損失由會員自行承擔。同時，通過該會員的個人帳戶在“給樂網”上發生的所有活動以及產生的責任，亦應由該會員承擔。本站將會把產品送到會員所指定的送貨地址，所有物流費會員承擔。所有在本站上列出的送貨時間為參考時間，參考時間的計算是根據庫存狀況、正常的處理過程和送貨時間、送貨地點的基礎上估計得出的。請清楚準確地填寫會員的真實姓名、送貨地址及聯絡方式。因如下情況造成訂單延遲或無法配送等，本站將無需承擔遲延配送的責任：(1)
會員提供錯誤資訊和不詳細的地址；(2)貨物送達無人簽收，由此造成的重複配送所產生的費用及相關的後果。(3)不可抗力，例如：自然災害、交通戒嚴、突發戰爭等。如果會員需要辦理退換貨，可通過以下方式進行辦理：（1）網站自助服務：可以更換商品的顏色或尺碼，如需辦理，可登入給樂網“我的給樂商城-我的訂單”直接辦理（瞭解詳細的辦理方式，可點選檢視網上退換貨流程）。
（2）客服電話：4000-200-365（僅收市話費）
（3）會員接受給樂為了保障公司業務發展和調整的自主權，擁有隨時修改或中斷服務而不需通知會員的權利，給樂行使修改或中斷服務的權利不需對會員或任何第三方負責。會員必須在同意本條款的前提下，給樂才開始對使用者提供服務。尊重會員個人隱私是本站的一項基本政策。本站一定不會在未經合法會員授權時公開、編輯或透露其註冊資料及儲存在本站中的非公開內容。本站將可能不定期的修改本會員協議的有關條款，一旦條款及服務內容產生變動，本站將會在重要頁面上提示修改內容。法律管轄和其他（1）本協議的訂立、執行和解釋及爭議的解決均應適用中國法律。（2）如發生本站服務條款與中國法律相抵觸時，則這些條款將完全按法律規定重新解釋，而其它有效條款繼續有效。（3）<b>如雙方就本協議內容或其執行發生任何爭議，雙方應盡力友好協商解決；協商不成時，任何一方均可向廣東省深圳市羅湖區人民法院提起訴訟。</b>
</p>
<div class="sign-group mt10">
<button class="but1" onclick="layer.closeAll();">我已閱讀並瞭解</button>
</div>
<br>
</div>
</div>
</div>
</div>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script src="js/layer-mobile/layer.js"></script>
<script src="js/icheck.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript">
var leftSeconds = 60;//倒計時時間10秒
var intervalId;
function CountDown() {//倒計時方法,此段程式碼不能放$(document).ready(function()中，否則無法執行
if (leftSeconds <= 0) {
$("#chkButtons").val("獲取驗證碼"); //當時間<=0的時候改變按鈕的value
$("#chkButtons").attr("disabled",false);//如果時間<=0的時候按鈕可用
clearInterval(intervalId); //取消由 setInterval() 設定的 timeout
return;
}
leftSeconds--;
$("#chkButtons").val("倒計時:"+leftSeconds+"秒");
}
$("#regshow").click(function(){
var random = $("#moRadom").val();
$.ajax({
type: 'POST',
dataType: 'json',
url: 'JsonAction',
async: false,
data: {'moRadom' : random},
success: function(json){
jsondata=$.parseJSON(json);
var t=jsondata.data;
var divshow = $("#regshow");
divshow.text("");// 清空資料
h="<img id=\"mops\" src='data:image/jpg;base64,"+t+"' style=\"width:79px;height:30px;margin-right:-4px;\"/>";
divshow.append(h);
},
error:function() {
alert("系統資料異常,請稍後再試......");
}
});
});
$(document).ready(function() {
$.ajax({
type: 'POST',
dataType: 'json',
url: 'JsonAction',
async: false,
success: function(json){
jsondata=$.parseJSON(json);
var t=jsondata.data;
var randomcode= jsondata.randomcode;
var divshow = $("#regshow");
var random = $("#moRadom").val(randomcode);
divshow.text("");// 清空資料
h="<img id=\"mops\" src='data:image/jpg;base64,"+t+"' style=\"width:79px;height:30px;margin-right:-4px;\"/>";
divshow.append(h);
},
error:function() {
alert("系統資料異常,請稍後再試......");
}
});
$("#chkButtons").click(function(){
$('#errorMessage').html(""); //初始化錯誤提示資訊
$("#regform").removeAttr("action");
$("#mobileNo").removeClass("red-b");
$("#password").removeClass("red-b");
$("#checkSn").removeClass("red-b");
var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;
var flag = true;
var mobileno = $('#mobileNo').val();
if (mobileno == "") {
$('#mobileNo').focus();
$('#errorMessage').html("請輸入手機號碼！");
//alert('請輸入手機號碼！');
flag = false;
$("#mobileNo").addClass("red-b");
return false;
//此處不能用return,否則程式會繼續執行
}else if(mobileno.length !=11){
message = "";
$('#mobileNo').focus();
$('#errorMessage').html("請輸入有效的手機號碼！");
//alert('請輸入手機號碼！');
flag = false;
$("#mobileNo").addClass("red-b");
return false;
}
var password = $('#password').val();
if (password == "") {
$('#password').focus();
$('#errorMessage').html("請輸入密碼！");
//alert('請輸入密碼！');
flag = false;
$("#password").addClass("red-b");
return false;
}
//密碼不能少於6位
if (password.length!=6) {
$('#password').focus();
$('#errorMessage').html("請輸入6位密碼！");
//alert('請輸入密碼！');
flag = false;
$("#password").addClass("red-b");
return false;
}
var checkSnp = $('#checkSnp').val();
if (checkSnp == "") {
$('#checkSnp').focus();
$('#errorMessage').html("請輸入圖片驗證碼！");
//alert('請輸入驗證碼！');
flag = false;
$("#checkSnp").addClass("red-b");
return false;
}
var checkSnp = $('#checkSnp').val();
var mobileNo = $('#mobileNo').val();
var random = $("#moRadom").val();
$.ajax({
type: 'POST',
dataType: 'json',
url: 'MessageAction',
async: false,
data: {'mobileNo' : mobileNo ,'checkSnp' : checkSnp ,'random' : random},
success: function(json){
jsondata=$.parseJSON(json);
var error=jsondata.descript;
$('#errorMessage').html(error);
if (jsondata.result =="0") { //代表驗證碼發放成功
$("#chkButtons").attr("disabled", true);//設定簡訊發放按鈕不可用
intervalId = setInterval("CountDown()",1000);//呼叫倒計時的方法
} else {
$("#chkButtons").attr("disabled", false);//設定簡訊發放按鈕不可用
}
},
error:function() {
alert("系統資料異常,請稍後再試......message");
}
});
});
$("#close").click(function() {
$("#tipsdiv").addClass("hid");
});
$("#readagreetext").click(function() {
//以下是關於手機上的應用模式
var pageii = layer.open({
type: 1,
content:$("#agree_text").html(),
style: 'position:fixed; left:0; top:0; width:100%; height:100%; border:none;overflow:auto;padding:10px'
});
// //提示框
// layer.open({
// content: '您好',
// time: 2 //2秒後自動關閉
// });
// //資訊框
// layer.open({
// title: '資訊',
// content: '移動版和PC版不能同時使用在同一頁面。'
// });
// //詢問框
// layer.open({
// title: '提示',
// content: '您確定要重新整理一下本頁面嗎？',
// btn: ['嗯', '不要'],
// yes: function(index){
// location.reload();
// layer.close(index);
// }
// });
// //頁面層
// layer.open({
// type: 1,
// content: '可傳入任何內容，支援html。一般用於手機頁面中',
// anim: 0,
// style: 'position:fixed; bottom:0; left:0; width:100%; height:150px; padding:10px 0; border:none;'
// });
// //載入層
// layer.open({type: 2});
});
$('input').iCheck({
checkboxClass : 'icheckbox_square-grey',
increaseArea : '20%' // optional
});
var height1 = $(document).height();
$(window).load(function() {
$("#bg-phone").height(height1);
});
//樣式設定
$("input").bind("focus", function() {
$(this).addClass("hidden");
})
$(".red-b").bind("blur", function() {
if ($(this).val().length !== 0)
$(this).removeClass("red-b");
})
$("input").bind("blur", function() {
if ($(this).val().length == 0)
$(this).removeClass("hidden");
})
});
</script>
</body>
</html>
<%@page import="com.gl.dao.*, com.gl.bean.MobileReg"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!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">
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0">
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<title>我的邀請</title>
<link href="css/style-phone.css" rel="stylesheet">
<link href="css/grey.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.blockUI.js"></script>
<script src="public/new/js/jquery-1.8.3.min.js"></script>
<!--百度地圖取得城市不可省略-->
<script type="text/javascript"
src="http://api.map.baidu.com/api?v=2.0&ak=hEbCHFklzlNWe43gA7gAgxv2"></script>
<script type="text/javascript">
// 百度地圖API功能
var map = new BMap.Map("bdMapBox");
var nowCity = new BMap.LocalCity();
nowCity.get(bdGetPosition);
function bdGetPosition(result) {
//當前的城市名
var cityName = result.name;
/*把城市名傳遞給頁面中的hidden，以便於傳值*/
//atCity.value = cityName;
document.getElementById("atCity").value = cityName;
/*自定義程式碼*/
}
</script>
<!--不可省略-->
</head>
<body>
<div class="container bg-phone" id="bg-phone">
<div class="content">
<div class="logo">
<img src="images/logo.png">
</div>
<s:form method="post" class="sign-form" id="regform">
<br>
<s:set name="backMessage" value="#request.backMessage" />
<div class="row">
<div style="color: #F00">
<h3 id="errorMessage">
<s:if test="#backMessage!=null">
${backMessage}
</s:if>
</h3>
<input type="hidden" id="msg"
value="<s:property value='backMessage' />">
</div>
</div>
<s:set name="backresult" value="#request.backresult" />
<s:if test="#backresult!=null">
<div class="row">
<div style="color: #F00">
<h3>
<input type="hidden" id="backresult"
value="<s:property value='backresult' />">
</h3>
</div>
</div>
</s:if>
<s:set name="sendMsgOk" value="#request.sendMsgOk" />
<s:if test="#sendMsgOk!=null">
<input id="sendMsgOk"
value="<s:property value='sendMsgOk' />">
</s:if>
<div class="sign-group mt10">
<%-- <s:textfield name="MobileReg.mobileNo" placeholder="手機號碼" type="tel" /> --%>
<input name="mobileReg.mobileNo" value="${mobileReg.mobileNo}"
id="mobileNo" type="tel" placeholder="手機號碼" maxlength="11"
onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
<input name="moRadom" value=""
id="moRadom" type="hidden" ></input>
</div>
<div class="sign-group mt10">
<%-- <s:textfield name="MobileReg.password" placeholder="密碼(6位數)" type="password"/> --%>
<input name="mobileReg.password" value="${mobileReg.password}"
id="password" type="password" placeholder="密碼(6位數)" maxlength="6"
onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="sign-group mt10 overf">
<!-- class="red-b"為報錯時新增的樣式 -->
<div class="chack">
<input id="checkSnp" name="mobileReg.checkSnp"
value="${mobileReg.checkSnp}" type="telp" placeholder="影象驗證碼"
maxlength="4" onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="chack-but">
<!-- <input id="submitMobile" type="button" name="button2" value="獲得校驗碼11" > -->
<div id="regshow"><img id="imgregshow" style="width:76px; height:30"></div>
</div>
</div>
<div class="sign-group mt10 overf">
<!-- class="red-b"為報錯時新增的樣式 -->
<div class="chack">
<%-- <s:textfield class="red-b" name="MobileReg.checkSn" placeholder="驗證碼" type="number" /> --%>
<input id="checkSn" name="mobileReg.checkSn"
value="${mobileReg.checkSn}" type="tel" placeholder="驗證碼"
maxlength="6" onkeyup="this.value=this.value.replace(/\D/g,'')"
onafterpaste="this.value=this.value.replace(/\D/g,'')"></input>
</div>
<div class="chack-but">
<!-- <input id="submitMobile" type="button" name="button2" value="獲得校驗碼11" > -->
<input type="button" class="but2" id="chkButtons" style="margin-right:-3px;height:30px;width:77px;" value="獲取驗證碼"></button>
</div>
</div>
<div class="sign-group mt10">
<input id="read_checkbox" type="checkbox" checked /> <span
class="xieyi">我已同意
<a href="javascript:void(0)" id="readagreetext">《給樂生活使用者協議》</a>
<a id="downloadapp">立即下載APP</a>
</span> <br>
<!--不可省略-->
<div id="bdMapBox" style="display: none;"></div>
<div style="color: #F00; display: none;">
<input type="text" id="atCity" name="atCity" value="" />
<%-- 當前所在的城市為：<span id="atCity" ></span> --%>
</div>
<!--不可省略-->
</div>
<div class="sign-group mt10">
<button id="regButton" class="but1">立即註冊</button>
</div>
<input type="hidden" name="mobileReg.city" id="city">
</s:form>
</div>
<!-- class="succwss hid"中的hid為隱藏，當註冊成功時，把hid去掉，便會顯示註冊成功，把hid刪除掉可以看效果-->
<div class="success hid" id="tipsdiv">
<div class="tips">
<h3 id="tipmessage">你已註冊成功，請操作以下步驟</h3>
<div class="sign-group mt10">
<a class="but1" id="downloadurl">下載APP，立刻體驗</a>
</div>
<p>
<!-- <a href="#" id="close">過後再下載</a> -->
<a href="javascript:void(0)" id="close">過後再下載</a>
</p>
</div>
</div>
<div class="success hid" >
<div id="agree_text">
<div style="color: #000;" >
<h3 class="text-center">給樂生活使用者協議</h3>
<div class="sign-group mt10">
<button class="but1" onclick="layer.closeAll();">我已閱讀並瞭解</button>
</div>
<p>本《協議》是您與深圳給樂資訊科技有限公司（下稱“給樂”）及其會員在“給樂網”www.365gl.com（下稱“給樂網”）上關於註冊、使用、管理給樂網賬戶，以及使用給樂網相關服務所訂立的協議。給樂商城及其涉及到的商業模式、產品、商品、服務的所有權和運營權都歸給樂所有。給樂對網站有修改、完善、變更、監督、提示的權利。本協議內容的正文和給樂已經發布的或即將釋出的各種規則、宣告等，都具備同等的法律效力。</p>
<b>一、會員註冊協議:</b>
<p>
1、在接受本協議之前，請您仔細閱讀本協議的全部內容。如果您對本協議的條款有疑問的，請通過客服渠道進行詢問，給樂公司將向您解釋條款內容。<b>如果您不同意本協議的任意內容，或者無法準確理解給樂公司對條款的解釋，請不要同意本協議或使用本協議項下的服務，否則，表示您已接受了以下所述的條款和條件，同意受本協議約束。屆時您不應以未閱讀本協議的內容或者未獲得給樂公司對您問詢的解答等理由，主張本協議無效，或要求撤銷本協議</b>;
</p>
<p>2、您承諾接受並遵守本協議的約定即可註冊成為會員。如果您不同意本協議的約定，您應立即停止註冊程式或停止使用給樂網服務;</p>
<p>
3、<b>給樂網有權根據需要不時地制訂、修改本協議或各類規則，並以網站公示的方式進行公告，不再單獨通知您。變更後的協議和規則一經在網站公佈後，立即自動生效。如您不同意相關變更，應當立即停止使用給樂網服務，如您繼續使用給樂網服務，即表示您接受經修訂的協議。</b>
</p>
<b>二、給樂服務保護條款:</b>
<p>1、
“給樂網”服務僅供依法能夠且有權訂立具有法律約束力合約的自然人、法人及非法人組織使用。因此，使用者應為具備完全民事行為能力的自然人，或依法成立、存續的法人或非法人組織。使用者違反本項條件，“給樂網”可隨時、全權決定拒絕向其提供服務，若因此給“給樂網”或第三方造成損失，使用者承擔全部賠償責任。</p>
<p>2、本站運用自己的作業系統通過國際網際網路絡為會員（使用者）提供網路服務。同時，會員（使用者）必須自行配備上網的所需裝置，包括個人電腦、調變解調器或其它必備上網裝置;自行負擔個人上網所支付的與此服務有關的電話費用、網路費用。基於本站所提供的網路服務的重要性，會員（使用者）應同意提供詳盡、準確的個人資料，並不斷更新註冊資料，使其符合及時、詳盡、準確的要求。本站保證不公開使用者的真實姓名、地址、電子郵箱和聯絡電話等使用者資訊，
除以下情況外： (1)使用者授權本站透露這些資訊。 (2)相應的法律及程式要求本站提供使用者的個人資料。</p>
<p>3、給樂網為會員（使用者）提供合法的、健康的產品及服務，但是會員（使用者）應對其使用“給樂網”自行承擔責任及風險，給樂在任何情況下不就因會員使用或不是“給樂網”提供的服務所發生的特殊的、意外的、直接或間接的損失承擔賠償責任。（1）禁止任何商業目的的註冊。“給樂網”鼓勵以使用為目的換領和換購給樂商品，但禁止一切商業目的和商業行為，若會員（使用者）利用“給樂網”的服務、產品從事任何以商業為目的行為，給樂有權採取取消訂單、凍結或關閉賬戶等措施，給給樂造成的損失，會員（使用者）承擔賠償責任，構成犯罪的，給樂有權提請國家主管部門追究其行政和刑事責任。（2）本站將盡最大努力保證您所購商品與市場上公佈的價格接近。產品的價格和可獲性都在本站上指明，這類資訊將隨時更改。您所換購的商品，如果發生缺貨，會員有權取消定單。</p>
<b>三、給樂網會員使用規則 </b>
<p>1、
特別提示會員（使用者），使用網際網路必須遵守國家有關的政策和法律，包括刑法、國家安全法、保密法、計算機資訊系統安全保護條例等，保護國家利益，保護國家安全，對於違法使用網際網路絡而引起的一切責任，由使用者負全部責任。</p>
<p>2、
會員（使用者）在申請使用“給樂網”提供的網路服務時，必須向給樂提供詳盡準確的個人資料，如個人資料有任何變動，必須及時更新，因資訊有誤導致的損失將由使用者自行承擔。</p>
<p>3、會員（使用者）可在“給樂網”評論及檢視資訊，但不得通過“給樂網”傳送或傳播敏感資訊和違反國家法律法規政策的資訊，此類資訊包括但不限於：（1）
反對憲法所確定的基本原則的；（2） 危害國家安全，洩露國家祕密，顛覆國家政權，破壞國家統一的;（3） 損害國家榮譽和利益的;（4）
煽動民族仇恨、民族歧視，破壞民族團結的； (5） 破壞國家宗教政策，宣揚邪教和封建迷信的；（6）
散佈謠言，擾亂社會秩序，破壞社會穩定的；（7） 散佈淫穢、色情、賭博、暴力、凶殺、恐怖或者教唆犯罪的；（8）
侮辱或者誹謗他人，侵害他人合法權益的；（9） 含有法律、行政法規禁止的其他內容的。</p>
<p>4、會員（使用者）享有檢舉權，會員（使用者）在使用“給樂網”服務過程中若發現違法、違規、侵權或其他任何違反本服務條款的行為，有權通過給樂網客服向給樂進行檢舉，給樂將通過對舉報內容的核實採取相應的措施。會員（使用者）保證其檢舉事項的真實性、公正性，同時尊重給樂對被檢舉事項的處置措施。</p>
<p>
5、<b>會員（使用者）違反本條“使用者使用基本規則”，給樂公司有權視情節的嚴重採取警告、限期改正、暫停服務、取消訂單、禁止交易、封閉帳號、永久禁止註冊等措施，給給樂公司或第三方造成損失的，給樂公司有權採取一切合法的訴訟與非訴手段進行索賠；會員（使用者）行為構成犯罪的，給樂公司有權通知和協助國家主管部門進行查處。</b>
</p>
<p>6、使用者一旦註冊成功，成為本站的合法會員，將得到一個密碼和使用者名稱。會員可隨時根據指示改變您的密碼。會員需謹慎合理的儲存、使用使用者名稱和密碼。會員若發現任何非法使用會員帳號或存在安全漏洞的情況，請立即通知本站和向公安機關報案。</p>
<p>
7、使用“給樂網”服務過程中，會員有義務保管好個人賬號及密碼，並對他人使用私人計算機作出限制。如果因為會員管理不善造成帳號、密碼等被複制或被盜用，相應損失由會員自行承擔。同時，通過該會員的個人帳戶在“給樂網”上發生的所有活動以及產生的責任，亦應由該會員承擔。本站將會把產品送到會員所指定的送貨地址，所有物流費會員承擔。所有在本站上列出的送貨時間為參考時間，參考時間的計算是根據庫存狀況、正常的處理過程和送貨時間、送貨地點的基礎上估計得出的。請清楚準確地填寫會員的真實姓名、送貨地址及聯絡方式。因如下情況造成訂單延遲或無法配送等，本站將無需承擔遲延配送的責任：(1)
會員提供錯誤資訊和不詳細的地址；(2)貨物送達無人簽收，由此造成的重複配送所產生的費用及相關的後果。(3)不可抗力，例如：自然災害、交通戒嚴、突發戰爭等。如果會員需要辦理退換貨，可通過以下方式進行辦理：（1）網站自助服務：可以更換商品的顏色或尺碼，如需辦理，可登入給樂網“我的給樂商城-我的訂單”直接辦理（瞭解詳細的辦理方式，可點選檢視網上退換貨流程）。
（2）客服電話：4000-200-365（僅收市話費）
（3）會員接受給樂為了保障公司業務發展和調整的自主權，擁有隨時修改或中斷服務而不需通知會員的權利，給樂行使修改或中斷服務的權利不需對會員或任何第三方負責。會員必須在同意本條款的前提下，給樂才開始對使用者提供服務。尊重會員個人隱私是本站的一項基本政策。本站一定不會在未經合法會員授權時公開、編輯或透露其註冊資料及儲存在本站中的非公開內容。本站將可能不定期的修改本會員協議的有關條款，一旦條款及服務內容產生變動，本站將會在重要頁面上提示修改內容。法律管轄和其他（1）本協議的訂立、執行和解釋及爭議的解決均應適用中國法律。（2）如發生本站服務條款與中國法律相抵觸時，則這些條款將完全按法律規定重新解釋，而其它有效條款繼續有效。（3）<b>如雙方就本協議內容或其執行發生任何爭議，雙方應盡力友好協商解決；協商不成時，任何一方均可向廣東省深圳市羅湖區人民法院提起訴訟。</b>
</p>
<div class="sign-group mt10">
<button class="but1" onclick="layer.closeAll();">我已閱讀並瞭解</button>
</div>
<br>
</div>
</div>
</div>
</div>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script src="js/layer-mobile/layer.js"></script>
<script src="js/icheck.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript">
var leftSeconds = 60;//倒計時時間10秒
var intervalId;
function CountDown() {//倒計時方法,此段程式碼不能放$(document).ready(function()中，否則無法執行
if (leftSeconds <= 0) {
$("#chkButtons").val("獲取驗證碼"); //當時間<=0的時候改變按鈕的value
$("#chkButtons").attr("disabled",false);//如果時間<=0的時候按鈕可用
clearInterval(intervalId); //取消由 setInterval() 設定的 timeout
return;
}
leftSeconds--;
$("#chkButtons").val("倒計時:"+leftSeconds+"秒");
}
$("#regshow").click(function(){
var random = $("#moRadom").val();
$.ajax({
type: 'POST',
dataType: 'json',
url: 'JsonAction',
async: false,
data: {'moRadom' : random},
success: function(json){
jsondata=$.parseJSON(json);
var t=jsondata.data;
var divshow = $("#regshow");
divshow.text("");// 清空資料
h="<img id=\"mops\" src='data:image/jpg;base64,"+t+"' style=\"width:79px;height:30px;margin-right:-4px;\"/>";
divshow.append(h);
},
error:function() {
alert("系統資料異常,請稍後再試......");
}
});
});
$(document).ready(function() {
$.ajax({
type: 'POST',
dataType: 'json',
url: 'JsonAction',
async: false,
success: function(json){
jsondata=$.parseJSON(json);
var t=jsondata.data;
var randomcode= jsondata.randomcode;
var divshow = $("#regshow");
var random = $("#moRadom").val(randomcode);
divshow.text("");// 清空資料
h="<img id=\"mops\" src='data:image/jpg;base64,"+t+"' style=\"width:79px;height:30px;margin-right:-4px;\"/>";
divshow.append(h);
},
error:function() {
alert("系統資料異常,請稍後再試......");
}
});
$("#chkButtons").click(function(){
$('#errorMessage').html(""); //初始化錯誤提示資訊
$("#regform").removeAttr("action");
$("#mobileNo").removeClass("red-b");
$("#password").removeClass("red-b");
$("#checkSn").removeClass("red-b");
var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;
var flag = true;
var mobileno = $('#mobileNo').val();
if (mobileno == "") {
$('#mobileNo').focus();
$('#errorMessage').html("請輸入手機號碼！");
//alert('請輸入手機號碼！');
flag = false;
$("#mobileNo").addClass("red-b");
return false;
//此處不能用return,否則程式會繼續執行
}else if(mobileno.length !=11){
message = "";
$('#mobileNo').focus();
$('#errorMessage').html("請輸入有效的手機號碼！");
//alert('請輸入手機號碼！');
flag = false;
$("#mobileNo").addClass("red-b");
return false;
}
var password = $('#password').val();
if (password == "") {
$('#password').focus();
$('#errorMessage').html("請輸入密碼！");
//alert('請輸入密碼！');
flag = false;
$("#password").addClass("red-b");
return false;
}
//密碼不能少於6位
if (password.length!=6) {
$('#password').focus();
$('#errorMessage').html("請輸入6位密碼！");
//alert('請輸入密碼！');
flag = false;
$("#password").addClass("red-b");
return false;
}
var checkSnp = $('#checkSnp').val();
if (checkSnp == "") {
$('#checkSnp').focus();
$('#errorMessage').html("請輸入圖片驗證碼！");
//alert('請輸入驗證碼！');
flag = false;
$("#checkSnp").addClass("red-b");
return false;
}
var checkSnp = $('#checkSnp').val();
var mobileNo = $('#mobileNo').val();
var random = $("#moRadom").val();
$.ajax({
type: 'POST',
dataType: 'json',
url: 'MessageAction',
async: false,
data: {'mobileNo' : mobileNo ,'checkSnp' : checkSnp ,'random' : random},
success: function(json){
jsondata=$.parseJSON(json);
var error=jsondata.descript;
$('#errorMessage').html(error);
if (jsondata.result =="0") { //代表驗證碼發放成功
$("#chkButtons").attr("disabled", true);//設定簡訊發放按鈕不可用
intervalId = setInterval("CountDown()",1000);//呼叫倒計時的方法
} else {
$("#chkButtons").attr("disabled", false);//設定簡訊發放按鈕不可用
}
},
error:function() {
alert("系統資料異常,請稍後再試......message");
}
});
});
$("#close").click(function() {
$("#tipsdiv").addClass("hid");
});
$("#readagreetext").click(function() {
//以下是關於手機上的應用模式
var pageii = layer.open({
type: 1,
content:$("#agree_text").html(),
style: 'position:fixed; left:0; top:0; width:100%; height:100%; border:none;overflow:auto;padding:10px'
});
// //提示框
// layer.open({
// content: '您好',
// time: 2 //2秒後自動關閉
// });
// //資訊框
// layer.open({
// title: '資訊',
// content: '移動版和PC版不能同時使用在同一頁面。'
// });
// //詢問框
// layer.open({
// title: '提示',
// content: '您確定要重新整理一下本頁面嗎？',
// btn: ['嗯', '不要'],
// yes: function(index){
// location.reload();
// layer.close(index);
// }
// });
// //頁面層
// layer.open({
// type: 1,
// content: '可傳入任何內容，支援html。一般用於手機頁面中',
// anim: 0,
// style: 'position:fixed; bottom:0; left:0; width:100%; height:150px; padding:10px 0; border:none;'
// });
// //載入層
// layer.open({type: 2});
});
$('input').iCheck({
checkboxClass : 'icheckbox_square-grey',
increaseArea : '20%' // optional
});
var height1 = $(document).height();
$(window).load(function() {
$("#bg-phone").height(height1);
});
//樣式設定
$("input").bind("focus", function() {
$(this).addClass("hidden");
})
$(".red-b").bind("blur", function() {
if ($(this).val().length !== 0)
$(this).removeClass("red-b");
})
$("input").bind("blur", function() {
if ($(this).val().length == 0)
$(this).removeClass("hidden");
})
});
</script>
</body>
</html>