VIP会员
购物车
私信
发表新帖
立即签到
查看视频
关注
回复
支持(
反对(
首页上一页 1 下一页尾页 1 条记录 1/1页
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册</title>
<!-- 引入外部CSS文件 -->
<link rel="stylesheet" type="text/css" href="css/basic.css" />
<link rel="stylesheet" type="text/css" href="css/login.css" />
</head>
<body>
<!-- 顶部 -->
<div>
<a href="index.html"><img alt="" src="images/logobig.png"/></a>
</div>
<!-- 主区域 -->
<div>
<div>
<div><span></span><img src="images/big.png"/></div>
<div>
<div id="doc-my-tabs">
<ul class="mr-tabs-nav mr-nav mr-nav-tabs mr-nav-justify">
<li><a href="">注册</a></li>
</ul>
<div>
<div class="mr-tab-panel mr-active">
<!-- 表单开始 ＋ 以post方式提交表單數據-->
<form id="myForm" method="POST" action="addUser.php" name="register">
<!-- 邮箱输入框 -->
<div>
<label for="email"><i></i></label>
<input type="email" name="email" id="email" placeholder="请输入邮箱账号">
</div>
<!-- 密码输入框 -->
<div>
<label for="password"><i></i></label>
<input type="password" name="password" id="password" placeholder="设置密码">
</div>
<!-- 确认密码输入框 -->
<div>
<label for="passwordRepeat"><i></i></label>
<input type="password" name="passwordRepeat" id="passwordRepeat" placeholder="确认密码">
</div>
<!-- 手机号输入框 -->
<div>
<label for="password"><i></i><span style="color:red;margin-left:5px">*</span></label>
<input name="tel" type="text" id="tel" placeholder="请输入手机号">
</div>
<!-- 手机验证码 -->
<div>
<label for="passwordRepeat"><i></i><span style="color:red;margin-left:5px">*</span></label>
<input type="text" name="tel" id="code" placeholder="请输入手机验证码" style="width: 60%">
<button id="getPhoneCode" type="button" style="float: right;height: 40px;width:40%">获取验证码</button>
</div>
</form>
<!-- 表单结束 -->
<div>
<!-- 服务协议勾选框 -->
<label for="reader-me">
<input id="reader-me" type="checkbox"> 点击表示您同意商城《服务协议》
</label>
<a href="login.html">登录</a>
</div>
<div>
<input type="submit" onclick="mr_verify()" value="注册" class="mr-btn mr-btn-primary mr-btn-sm mr-fl">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 底部信息 -->
<div class="footer ">
<div class="footer-hd ">
<p>
<a href="http://www.mingrisoft.com/" target="_blank">明日科技</a>
<b>|</b>
<a href="#">商城首页</a>
<b>|</b>
<a href="#">支付宝</a>
<b>|</b>
<a href="#">物流</a>
</p>
</div>
<div class="footer-bd ">
<p>
<a href="#">关于明日</a>
<a href="#">合作伙伴</a>
<a href="#">联系我们</a>
<a href="#">网站地图</a>
<em>© 2007-2017 mingrisoft.com 版权所有</em>
</p>
</div>
</div>
</div>
<!-- script -->
<script>
/*校验电话码格式 */
function checkMobile(str)
{
var reg=/1[3,5,6,7,8,9]\d{8}/;
return reg.test(str);
}
// 表單驗證
function mr_verify(){
// 獲取表單對象
var email = document.getElementById("email");
var password = document.getElementById("password");
var passwordRepeat = document.getElementById("passwordRepeat");
var tel = document.getElementById("tel");
var reader_me = document.getElementById("reader-me");
// 檢驗手機號
console.log(tel.value);
if(!checkMobile(tel.value)){
alert('手机号格式错误');
return false;
}
/*校验邮件地址是否合法 */
function checkEmail(str) {
var reg=/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
return reg.test(str);
}
// 驗證項目是否為空
if(email.value==='' || email.value===null){
alert("邮箱不能為空！ ");
return false; //終止程序，不再繼續執行
}
if(password.value==='' || password.value===null){
alert("密碼不能為空！ ");
return false; //終止程序，不再繼續執行
}
if(passwordRepeat.value==='' || passwordRepeat.value===null){
alert("確認密碼不能為空！ ");
return false; //終止程序，不再繼續執行
}
if(tel.value==='' || tel.value===null){
alert("手機號碼不能為空！ ");
return false; //終止程序，不再繼續執行
}
// 驗證邮件格式
apos = email.value.indexOf("@")
dotpos = email.value.lastIndexOf(".")
if(apos < 1 || dotpos - apos < 2){
alert("邮箱格式錯誤！ ");
}
// 驗證手機號格式
if(isNaN(tel.value)){
alert("手機號請輸入數字！ ");
return false;
}
if(tel.value.length!==11){
alert("手機號是11個數字！ ");
return false;
}
// 驗證是否選擇服務協議
if(reader_me.checked == false){
alert("只有同意商城《服務協議》才能注冊");
return false;
}
document.getElementById('myForm').submit();
alert('注冊成功！');
}
</script>
</body>
</html>
分享到：
