Página Inicial Explorar Ajuda
Registrar Entrar
bulomakaka
/
ekexiu.app
Observar 2
Favorito 1
Fork 0
Código Problemas 0 Pull Requests 0 Commits 533 Versões 0 Wiki
Ver Código Fonte

新注册

xuchunyang 8 anos atrás
pai
784702f4fc
commit
be96b6da0f
2 arquivos alterados com 94 adições e 47 exclusões
Visão dividida Mostrar estatísticas do Diff
  1. 24 23
      app/html/reg.html
  2. 70 24
      app/js/register.js

+ 24 - 23
app/html/reg.html
Ver Arquivo 

@ -11,39 +11,40 @@
11 11 
	</head>
12 12
13 13 
	<body>
14 
		<div class="closebtn mui-action-back">
15 
			<span class="mui-icon mui-icon-closeempty closeicon"></span>
16 
			<!--<div class="closeicon"></div>-->
17 
		</div>
14 
		<header class="mui-bar mui-bar-nav toptitbox">
15 
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
16 
		    <h1 class="mui-title toptit">注册</h1>
17 
		</header>
18 18 
		<div class="mui-content">
19 
			<div class="logobox">
20 
				<a class="logolink">
21 
					<img class="logoimg" src="../images/logo.png" />
22 
				</a>
23 
			</div>
24 
		    <form class="mui-input-group frmbox" id="frmbox">
25 
		        <div class="mui-input-row frm-input">
26 
		            <input type="tel" class="mui-input-clear frmtype" placeholder="请输入您的手机号" id="username">
19 
		    <form class="mui-input-group frmboxNew">
20 
		    	<div class="mui-input-row frm-input">
21 
		            <input type="text" class="mui-input-clear frmtype" placeholder="请输入真实姓名" id="name">
27 22 
		        </div>
28 23 
		        <div class="mui-input-row frm-input">
29 
					<input type="number" class="frmtype" placeholder="请输入验证码" id="set-code">
30 
					<span class="forgetword forgetword2" id="obtain-code">获取验证码</span>
31 
					<span class="forgetword" id="getcodeoff" style="display:none;"></span>
24 
		            <input type="tel" class="mui-input-clear frmtype" placeholder="请输入手机号" id="username">
25 
		        </div>
26 
		        <div class="mui-row mui-input-row frm-input">
27 
		        	<div class="mui-col-xs-8">
28 
		        		<input type="tel" class="frmtype" placeholder="请输入验证码" id="set-code">
29 
		        	</div>
30 
					<div class="mui-col-xs-4">
31 
						<input type="button" class="frmtype getCode" value="获取验证码" id="obtain-code">
32 
						<input type="button" class="frmtype getCode" value="" style="display: none;" id="getcodeoff">
33 
					</div>
34 
				</div>
35 
				<div class="mui-input-row frm-input">
36 
					<input id='setpassword' type="password" class="frmtype" placeholder="请设置登录密码">
32 37 
				</div>
33 38 
		    </form>
34 39
35 
		    <div class="mui-content-padded frmbox">
40 
		    <div class="mui-content-padded frmboxNew" style="margin-top: -4px">
36 41 
		    	<div class="protocolbox">
37 42 
			    	<label checked="true">
38 
			    		<span class="mui-icon iconfont icon-squarecheck iconagreecheck"></span>
39 
	                     <!--<em><img class="agreeicon" src="../images/agreenicon.png"/></em> -->
40 
	                    <input type="checkbox" name="checkbox" checked="true" style="display:none;">已同意<a href="" class="protocollink" target="_blank" id="protocollink">科袖网用户协议</a>
43 
			    		<span class="mui-icon iconfont icon-yuanxingxuanzhongfill"></span>
44 
	                    <input type="checkbox" name="checkbox" checked="true" style="display:none;">我已阅读并同意<a class="protocollink" id="protocollink">科袖网用户协议</a>
41 45 
	               </label>
42 46 
		    	</div>
43
44 
		    	<button id='reg' class="mui-btn mui-btn-block frmbtn frmactive2" >注&nbsp;册</button>
45 
				<button id='login' class="mui-btn mui-btn-block mui-btn-outlined frmbtn">返回登录</button>
46
47 
				<button class="mui-btn mui-btn-block frmbtn frmactive2" id='reg' disabled>注&nbsp;册</button>
47 48 
			</div>
48 49
49 50 
		</div>

+ 70 - 24
app/js/register.js
Ver Arquivo 

@ -2,25 +2,27 @@
2 2 
mui.ready(function() {
3 3
4 4 
	/*定义全局变量*/
5 
	var name = document.getElementById("name");
5 6 
	var phoneName = document.getElementById("username");
6 7 
	var setCode = document.getElementById("set-code");
7 8 
	var obtainCode = document.getElementById("obtain-code");
9 
	var setpassword = document.getElementById("setpassword");
8 10 
	var reg = document.getElementById("reg");
9 
	var login = document.getElementById("login");
10 11 
	var protocollink = document.getElementById("protocollink");
11 12 
	var phoneCode = false;
12 13 
	var state = 0;
13 14
14 15 
	mui.plusReady(function() {
15 16
16 
		/*点击登录页面*/
17 
		login.addEventListener('tap', function() {
18 
			goLoginFun();
19 
		})
20
21 17 
		/*校验提交按钮显示状态*/
22 
		mui('.frmbox').on('keyup', "#username,#set-code", function() {
23 
			hideButtn(phoneName,setCode,reg,"frmactiveok");
18 
		mui('.frmboxNew').on('keyup', "#name,#username,#set-code,#setpassword", function() {
19 
			if(name.value == "" || phoneName.value == "" || setCode.value == "" || setpassword.value == "") {
20 
				reg.classList.remove("frmactiveok");
21 
				reg.disabled = "disabled";
22 
			} else {
23 
				reg.classList.add("frmactiveok");
24 
				reg.disabled = "";
25 
			}
24 26 
		});
25 27
26 28 
		/*点击获取验证码*/

@ -43,7 +45,21 @@ mui.ready(function() {
43 45 
				}
44 46 
			});
45 47 
		});
46
48
49 
		/*校验真实姓名和密码*/
50 
		function valOld() {
51 
			var nameval = /^\w{0,20}$/;
52 
			if(nameval.test(name.value)) {
53 
				plus.nativeUI.toast("姓名最长为10个汉字或20个英文字符", toastStyle);
54 
				return;
55 
			} else if(setpassword.value.length < 6){
56 
				plus.nativeUI.toast("密码由6-24个字符组成，区分大小写", toastStyle);
57 
				return;
58 
			}else{
59 
				completeReg();
60 
			}
61 
		}
62
47 63 
		/*校验手机号*/
48 64 
		function phoneVal() {
49 65 
			var hunPhone = /^1[3|4|5|7|8]\d{9}$/;

@ -63,7 +79,7 @@ mui.ready(function() {
63 79 
				timeout: 10000, //超时设置
64 80 
				success: function(data) {
65 81 
					if(data.data == false) {
66 
						plus.nativeUI.toast("您的手机已被注册", toastStyle);
82 
						plus.nativeUI.toast("该账号已存在，请直接登录", toastStyle);
67 83 
						return;
68 84 
					} else {
69 85 
						phoneCode = true;

@ -81,6 +97,7 @@ mui.ready(function() {
81 97
82 98 
		/*手机发送验证码*/
83 99 
		function sendAuthentication() {
100 
			console.log("send code")
84 101 
			mui.ajax(baseUrl + '/ajax/regmobilephone', {
85 102 
				data: {
86 103 
					mobilePhone: phoneName.value

@ -90,6 +107,7 @@ mui.ready(function() {
90 107 
				async: false,
91 108 
				timeout: 10000, //超时设置
92 109 
				success: function(data) {
110 
					console.log(JSON.stringify(data))
93 111 
					if(data.success) {
94 112 
						state = data.data;
95 113 
						doClick();

@ -107,18 +125,18 @@ mui.ready(function() {
107 125 
			var getCodeOff = document.getElementById("getcodeoff");
108 126 
			obtainCode.style.display = "none";
109 127 
			getCodeOff.style.display = "block";
110 
			getCodeOff.innerHTML = "30s后重新获取";
128 
			getCodeOff.value = "30s后重新获取";
111 129 
			var clickTime = new Date().getTime();
112 130 
			var Timer = setInterval(function() {
113 131 
				var nowTime = new Date().getTime();
114 132 
				var second = Math.ceil(30 - (nowTime - clickTime) / 1000);
115 133 
				if(second > 0) {
116 
					getCodeOff.innerHTML = second + "s后重新获取";
134 
					getCodeOff.value = second + "s后重新获取";
117 135 
				} else {
118 136 
					clearInterval(Timer);
119 137 
					obtainCode.style.display = "block";
120 138 
					getCodeOff.style.display = "none";
121 
					obtainCode.innerHTML = "获取验证码";
139 
					obtainCode.value = "获取验证码";
122 140 
				}
123 141 
			}, 1000);
124 142 
		}

@ -138,23 +156,15 @@ mui.ready(function() {
138 156 
					console.log(data.success);
139 157 
					if(data.success) {
140 158 
						if(data.data) {
141 
							mui.openWindow({
142 
								url: 'setpass.html',
143 
								id: 'setpass.html',
144 
								extras: {
145 
									phoneName: phoneName.value,
146 
									setCode: setCode.value,
147 
									state: state
148 
								}
149 
							});
159 
							valOld();
150 160 
						}else{
151 
							plus.nativeUI.toast("验证码不正确", toastStyle);
161 
							plus.nativeUI.toast("验证码错误，请检查后重试", toastStyle);
152 162 
							return;
153 163 
						}
154 164 
					}else{
155 165 
						console.log(data.msg);
156 166 
						if(data.msg=="验证超时"){
157 
							plus.nativeUI.toast("验证码超时", toastStyle);
167 
							plus.nativeUI.toast("验证码已过期，请重新获取", toastStyle);
158 168 
							return;
159 169 
						}else{
160 170 
							plus.nativeUI.toast("请填写正确的手机号,验证码", toastStyle);

@ -170,5 +180,41 @@ mui.ready(function() {
170 180 
			})
171 181 
		}
172 182
183 
		//注册提交
184 
		function completeReg() {
185 
			mui.ajax(baseUrl + '/ajax/mobileReg', {
186 
				data: {
187 
					state: state,
188 
					mobilePhone: phoneName.value,
189 
					validateCode: setCode.value,
190 
					password: setpassword.value,
191 
					name:name.value
192 
				},
193 
				dataType: 'json', //数据格式类型
194 
				type: 'post', //http请求类型
195 
				//async: false,
196 
				success: function(data) {
197 
					if(data.success) {
198 
						var userId = data.data;
199 
						plus.storage.setItem('userid', userId);
200 
						plus.nativeUI.toast("已完成注册，请填写个人信息", toastStyle);
201 
						mui.openWindow({
202 
							url: 'fillinfo.html',
203 
							id: 'fillinfo.html',
204 
							extras: {
205 
								userid: userId
206 
							},
207 
							show: {
208 
								aniShow: "slide-in-right"
209 
							}
210 
						});
211 
					}
212 
				},
213 
				error: function() {
214 
					plus.nativeUI.toast("服务器链接超时", toastStyle);
215 
				}
216 
			});
217 
		}
218
173 219 
	});
174 220 
});