投稿

HTML5 用户注册页面源代码

Vedu • • 程序开发 • 阅读 2805

以下为HTML5 用户注册页面源代码图例和源程序文件代码

HTML5 用户注册页面

<head>

<meta charset=”UTF-8″>

<title></title>

<style>

td input[type=”text”],td input[type=”email”],td input[type=”password”], td input[type=”date”]{

width:98%;

}

</style>

<script>

function checkLength(){

var pwd=document.getElementById(“pwd”).value;

var spanLen=document.getElementById(“spanLen”);

if(pwd.length<=3&&pwd.length>0)

spanLen.innerHTML=”弱”;

else if(pwd.length<=6)

spanLen.innerText=”中”;

else

spanLen.innerText=”强”;

}

function checkPSW(){

var pwd1=document.getElementById(“pwd”).value;

var pwd2=document.getElementById(“pwd2”).value;

var pswInfo=document.getElementById(“pswInfo”);

if(pwd1!=pwd2)

pswInfo.innerText=”两次密码不同”; // alert(“两次密码不同”);

else

pswInfo.innerText=””;

}

</script>

</head>

<body>

<form>

<fieldset>

<legend>

用户注册页面

</legend>

<table align=”center” width=”500px” >

<caption>用户登录信息</caption>

<tr>

<td width=”20%” >用户名</td>

<td width=”40%”><input type=”text” required=”true” autofocus=”true”></td>

<td width=”40%”>*</td>

</tr>

<tr>

<td>邮箱</td>

<td><input type=”email” required=”true”></td>

<td>*</td>

</tr>

<tr>

<td>密码</td>

<td><input type=”password” id=”pwd” required=”true” onkeyup=”checkLength()”></td>

<td>*&nbsp<span id=”spanLen”></span></td>

</td>

</tr>

<tr>

<td>确认密码</td>

<td><input type=”password” id=”pwd2″ required=”true” onblur=”checkPSW()”></td>

<td align=”left”>*&nbsp<span id=”pswInfo” style=”color: #c41a15;”></span></td>

</tr>

</table>

<br>

<br>

<table align=”center” width=”500px”>

<caption>用户基本信息</caption>

<tr>

<td width=”20%”>性别</td>

<td width=”40%”>

<select size=”1″>

<option>男</option>

<option>女</option>

</select>

</td>

<td width=”40%”></td>

</tr>

<tr>

<td>出生年月</td>

<td><input type=”date”></td>

</tr>

<tr>

<td>住址</td>

<td><input type=”text”></td>

</tr>

<tr>

<td colspan=”2″>

<input type=”submit” value=”注册新用户”>

</td>

<td>

<input type=”reset” value=”重置”>

</td>

</tr>

</table>

</fieldset>

</form>

</body>

内容出处：，

声明：本网站所收集的部分公开资料来源于互联网，转载的目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。如果您发现网站上有侵犯您的知识产权的作品，请与我们取得联系，我们会及时修改或删除。文章链接：http://www.yixao.com/procedure/4823.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
VeduVedu
0 0
上一篇 2017-08-17 09:09
下一篇 2017-08-18 00:47

相关推荐

发表评论

登录后才能评论