效果图
源代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>黄菊华：H5+CSS3商城界面实战</title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="css/toubu_fanhui.css">
<link rel="stylesheet" href="css/huiyuan_zhuce.css">
</head>
<body>
<form name="frm" method="post">
<!--头部返回-->
<div class="dingbu">
<a href="javascript:history(-1)" class="dingbu_lianjie">
<img src="img/back.png" alt="" class="dingbu_lianjie_img" />
</a>
<p class="dingbu_biaoti">会员注册</p>
</div><br>
<!--会员-注册-信息部分-->
<div class="zhuce_shouji" style="border-top:1px solid #f2f2f2;">
<div class="zhuce_shouji_biaoti">手机号</div>
<div class="zhuce_shouji_shuru">
<input type="text" placeholder="请输入手机号码" class="zhuce_shouji_shuru_input" name="yonghuming" id="yonghuming" />
</div>
<!--div class="zhuce_shouji_yanzhenma">获取验证码</div-->
</div>
<!--div class="zhuce_shouji">
<div class="zhuce_shouji_biaoti">验证码</div>
<div class="zhuce_shouji_shuru">
<input type="text" placeholder="请输入验证码" class="zhuce_shouji_shuru_input" />
</div>
<div class="zhuce_shouji_yanzhenma">已经发送</div>
</div-->
<div class="zhuce_shouji">
<div class="zhuce_shouji_biaoti">设置密码</div>
<div class="zhuce_shouji_shuru">
<input type="password" placeholder="请输入新密码" class="zhuce_shouji_shuru_input" name="mima_1" id="mima_d" />
</div>
</div>
<div class="zhuce_shouji">
<div class="zhuce_shouji_biaoti">确认密码</div>
<div class="zhuce_shouji_shuru">
<input type="password" placeholder="请再次输入新密码" class="zhuce_shouji_shuru_input" name="mima_2" id="mima_2" />
</div>
</div>
<script>
function checkinfo()
{
var shouji = document.frm.yonghuming.value;
if(shouji==""){
alert("请输入手机号码1");
return false;
}else{
if(shouji.length!=11)
{
alert("请输入有效的手机号码2");
document.frm.yonghuming.focus();
return false;
}
var myreg = /^(((13[0-9]{ 1})|(15[0-9]{ 1})|(18[0-9]{ 1}))+\d{ 8})$/;
if(!myreg.test(shouji))
{
alert("请输入有效的手机号码3");
document.frm.yonghuming.focus();
return false;
}
}
if(document.frm.mima_1.value=="")
{
alert("请输入密码");
document.frm.mima_1.focus();
return false;
}
if(document.frm.mima_1.value!=document.frm.mima_2.value)
{
alert("两次输入的密码不同，请重新输入");
document.frm.mima_1.focus();
document.frm.mima_1.value="";
document.frm.mima_2.value="";
return false;
}
var yhm = document.frm.yonghuming.value;
var mm = document.frm.mima_1.value;
//alert(yhm+mm);
frm01.location = "check_h_reg.php?cs_yhm="+yhm+"&cs_mm="+mm ;
}
</script>
<iframe name="frm01" src="" width="0" height="0" frameborder="0"></iframe>
<!--会员-注册-附加信息-->
<div class="zhuce_fujia">
<div class="zhuce_fujia_tongyi">
<input type="checkbox" class="zhuce_fujia_tongyi_chk" />
阅读并同意《注册协议》
</div>
<!--button class="zhuce_fujia_btn" onClick="return checkinfo();"> 注册并登陆</button-->
<input type="button" class="zhuce_fujia_btn" value=" 提交注册 " onClick="return checkinfo();" >
<div class="zhuce_fujia_shuoming">登陆账号为您输入的手机号码</div>
<a href="#" class="zhuce_fujia_xieyi">查看注册协议</a>
</div>
</form>
</body>
</html>
参考网址：www.pc-365.net
本文地址：https://blog.csdn.net/u013818205/article/details/109235646
黄山市民网：https://www.huangshanshimin.com/
