用javascript生成一个注册页面,要求用户名和密码不能为空,密码和确认密码一样,年龄在0到100之间,急 10
2个回答
展开全部
给你个类似的话 自己改下就好
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>欢迎进入注册页面</title>
<script language="javascript">
function checkname(){
var div = document.getElementById("div1");
div.innerHTML = "";
var name1 = document.form1.text1.value;
if (name1 == "") {
div.innerHTML = "<font color=red>姓名不能为空!</font>";
document.form1.text1.focus();
return false;
}
if (name1.length < 4 || name1.length > 16) {
div.innerHTML = "<font color=red>姓名输入的长度4-16个字符!</font>";
document.form1.text1.select();
return false;
}
return true;
}
function checkpassword(){
var div = document.getElementById("div2");
div.innerHTML = "";
var password = document.form1.text2.value;
if (password == "") {
div.innerHTML = "<font color=red>密码不能为空!</font>";
document.form1.text2.focus();
return false;
}
if (password.length < 4 || password.length > 12) {
div.innerHTML = "<font color=red>密码长度4-12位</font>";
document.form1.text2.select();
return false;
}
return true;
}
function checkrepassword(){
var div = document.getElementById("div3");
div.innerHTML = "";
var password = document.form1.text2.value;
var repass = document.form1.text3.value;
if (repass == "") {
div.innerHTML = "<font color=red>密码不能为空!</font>";
document.form1.text3.focus();
return false;
}
if (password != repass) {
div.innerHTML = "<font color=red>输入密码和确认密码长度不一致</font>";
document.form1.text3.select();
return false;
}
return true;
}
function checkEmail(){
var div = document.getElementById("div4");
div.innerHTML = "";
var email = document.form1.text4.value;
var sw = email.indexOf("@", 0);
var sw1 = email.indexOf(".", 0);
var tt = sw1 - sw;
if (email.length == 0) {
div.innerHTML = "<font color=red>电子邮件不能为空</font>";
document.form1.text4.focus();
return false;
}
if (email.indexOf("@", 0) == -1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,必须包含@符号!</font>";
document.form1.text4.select();
return false;
}
if (email.indexOf(".", 0) == -1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,必须包含.符号!</font>";
document.form1.text4.select();
return false;
}
if (tt == 1) {
div.innerHTML = "<font color=red>邮件格式不对。@和.不可以挨着!</font>";
document.form1.text4.select();
return false;
}
if (sw > sw1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,@符号必须在.之前</font>";
document.form1.text4.select();
return false;
}
else {
return true;
}
return ture;
}
function checkPhone(){
var div = document.getElementById("div5");
div.innerHTML = "";
var phone = document.form1.text5.value;
if (phone == "") {
div.innerHTML = "<font color=red>手机号不能为空!</font>";
document.form1.text5.focus();
return false;
}
if (phone.length == 11) {
div.innerHTML = "<font color=red>手机号码只能为11个字符!</font>";
document.form1.text5.select();
return false;
}
return true;
}
function check(){
if (checkname() && checkpassword() && checkrepassword() && checkEmail()&&checkPhone()) {
var a = document.form1.text1.value;
var b = document.form1.text2.value;
var c = document.form1.text4.value;
var d = document.form1.text5.value;
var e = document.form1.text6.value;
alert("用户名:"+a+",密码:"+b+",邮件:"+c+",手机号码是:"+d+".学历是:"+e+",爱好:");
return true;
}
else {
return false;
}
}
</script>
</head>
<body>
<form name="form1" onSubmit="return check()">
<table border="1" align="center">
<tr>
<td>
<div align="right">用户名:</div></td>
<td>
<input id="text1" type="text" name="text1" onBlur="check()">
<div id="div1" style="display:inline;"> </div> </td>
</tr>
<tr>
<td>
<div align="right">密码: </div></td>
<td>
<input id="text2" type="password" name="text2" onBlur="check()">
<div id="div2" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">确认密码: </div></td>
<td>
<input id="text3" type="password" name="text3" onBlur="check()">
<div id="div3" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">电子邮件地址: </div></td>
<td>
<input id="text4" type="text" name="text4" onBlur="check()">
<div id="div4" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">手机号码: </div></td>
<td>
<input id="text5" type="text" name="text5" onBlur="check()">
<div id="div5" style="display:inline"> </div> </td>
</tr>
<tr align="center">
<td><div align="right">学历:</div></td>
<td><div align="left">
<select name="text6">
<option value="初中">初中</option>
<option value="高中">高中</option>
<option value="中专">中专</option>
<option value="大专">大专</option>
<option value="本科">本科</option>
<option value="硕士">硕士</option>
<option value="博士">博士</option>
</select>
</div></td>
</tr>
<tr align="center">
<td align="center"><div align="right">兴趣爱好:</div></td>
<td align="center">
<input type="checkbox" name="text11" value="篮球">
篮球
<input type="checkbox" name="checkbox12" value="音乐">
音乐
<input type="checkbox" name="checkbox13" value="足球">
足球
<input type="checkbox" name="checkbox14" value="其他">
其他</td>
</tr>
<tr align="center">
<td align="center"><input type="submit" value="提交" name="text8">
<input type="reset" value="重置" name="text9"></td>
<td align="center"> </td>
</tr>
</table>
</form>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>欢迎进入注册页面</title>
<script language="javascript">
function checkname(){
var div = document.getElementById("div1");
div.innerHTML = "";
var name1 = document.form1.text1.value;
if (name1 == "") {
div.innerHTML = "<font color=red>姓名不能为空!</font>";
document.form1.text1.focus();
return false;
}
if (name1.length < 4 || name1.length > 16) {
div.innerHTML = "<font color=red>姓名输入的长度4-16个字符!</font>";
document.form1.text1.select();
return false;
}
return true;
}
function checkpassword(){
var div = document.getElementById("div2");
div.innerHTML = "";
var password = document.form1.text2.value;
if (password == "") {
div.innerHTML = "<font color=red>密码不能为空!</font>";
document.form1.text2.focus();
return false;
}
if (password.length < 4 || password.length > 12) {
div.innerHTML = "<font color=red>密码长度4-12位</font>";
document.form1.text2.select();
return false;
}
return true;
}
function checkrepassword(){
var div = document.getElementById("div3");
div.innerHTML = "";
var password = document.form1.text2.value;
var repass = document.form1.text3.value;
if (repass == "") {
div.innerHTML = "<font color=red>密码不能为空!</font>";
document.form1.text3.focus();
return false;
}
if (password != repass) {
div.innerHTML = "<font color=red>输入密码和确认密码长度不一致</font>";
document.form1.text3.select();
return false;
}
return true;
}
function checkEmail(){
var div = document.getElementById("div4");
div.innerHTML = "";
var email = document.form1.text4.value;
var sw = email.indexOf("@", 0);
var sw1 = email.indexOf(".", 0);
var tt = sw1 - sw;
if (email.length == 0) {
div.innerHTML = "<font color=red>电子邮件不能为空</font>";
document.form1.text4.focus();
return false;
}
if (email.indexOf("@", 0) == -1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,必须包含@符号!</font>";
document.form1.text4.select();
return false;
}
if (email.indexOf(".", 0) == -1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,必须包含.符号!</font>";
document.form1.text4.select();
return false;
}
if (tt == 1) {
div.innerHTML = "<font color=red>邮件格式不对。@和.不可以挨着!</font>";
document.form1.text4.select();
return false;
}
if (sw > sw1) {
div.innerHTML = "<font color=red>电子邮件格式不正确,@符号必须在.之前</font>";
document.form1.text4.select();
return false;
}
else {
return true;
}
return ture;
}
function checkPhone(){
var div = document.getElementById("div5");
div.innerHTML = "";
var phone = document.form1.text5.value;
if (phone == "") {
div.innerHTML = "<font color=red>手机号不能为空!</font>";
document.form1.text5.focus();
return false;
}
if (phone.length == 11) {
div.innerHTML = "<font color=red>手机号码只能为11个字符!</font>";
document.form1.text5.select();
return false;
}
return true;
}
function check(){
if (checkname() && checkpassword() && checkrepassword() && checkEmail()&&checkPhone()) {
var a = document.form1.text1.value;
var b = document.form1.text2.value;
var c = document.form1.text4.value;
var d = document.form1.text5.value;
var e = document.form1.text6.value;
alert("用户名:"+a+",密码:"+b+",邮件:"+c+",手机号码是:"+d+".学历是:"+e+",爱好:");
return true;
}
else {
return false;
}
}
</script>
</head>
<body>
<form name="form1" onSubmit="return check()">
<table border="1" align="center">
<tr>
<td>
<div align="right">用户名:</div></td>
<td>
<input id="text1" type="text" name="text1" onBlur="check()">
<div id="div1" style="display:inline;"> </div> </td>
</tr>
<tr>
<td>
<div align="right">密码: </div></td>
<td>
<input id="text2" type="password" name="text2" onBlur="check()">
<div id="div2" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">确认密码: </div></td>
<td>
<input id="text3" type="password" name="text3" onBlur="check()">
<div id="div3" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">电子邮件地址: </div></td>
<td>
<input id="text4" type="text" name="text4" onBlur="check()">
<div id="div4" style="display:inline"> </div> </td>
</tr>
<tr>
<td>
<div align="right">手机号码: </div></td>
<td>
<input id="text5" type="text" name="text5" onBlur="check()">
<div id="div5" style="display:inline"> </div> </td>
</tr>
<tr align="center">
<td><div align="right">学历:</div></td>
<td><div align="left">
<select name="text6">
<option value="初中">初中</option>
<option value="高中">高中</option>
<option value="中专">中专</option>
<option value="大专">大专</option>
<option value="本科">本科</option>
<option value="硕士">硕士</option>
<option value="博士">博士</option>
</select>
</div></td>
</tr>
<tr align="center">
<td align="center"><div align="right">兴趣爱好:</div></td>
<td align="center">
<input type="checkbox" name="text11" value="篮球">
篮球
<input type="checkbox" name="checkbox12" value="音乐">
音乐
<input type="checkbox" name="checkbox13" value="足球">
足球
<input type="checkbox" name="checkbox14" value="其他">
其他</td>
</tr>
<tr align="center">
<td align="center"><input type="submit" value="提交" name="text8">
<input type="reset" value="重置" name="text9"></td>
<td align="center"> </td>
</tr>
</table>
</form>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
专门为你写的,够意思吧。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
li{line-height:30px;}
.styleinput{margin-left:80px;width:150px;}
.styleinput2{margin-left:16px;width:150px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style/form.css" rel="stylesheet" type="text/css" />
<title>无标题文档</title>
<script language="JavaScript">
function checkpost()
{
if(form1.name.value=="")
{
alert("请输入用户名");
form1.name.focus();
return false;
}
if(form1.password1.value=="")
{
alert("请输入密码");
form1.password1.focus();
return false;
}
if(form1.password2.value=="")
{
alert("请再次输入密码");
form1.password2.focus();
return false;
}
if(document.form1.password1.value != document.form1.password2.value)
{
alert("您两次输入的密码不一样!请重新输入.");
document.form1.password2.focus();
return false;
}
if(form1.password2.value=="")
{
alert("请再次输入密码");
form1.password2.focus();
return false;
}
if(form1.age.value=="")
{
alert("请输入年龄");
form1.age.focus();
return false;
}
if (document.form1.age.value > 100 || document.form1.age.value < 1)
{
alert("输入的年龄不能小于0大于100!");
document.form1.age.focus();
return false;
}
alert("注册成功");
}
</script>
</head>
<body>
<div>
<form name="form1" action="动态页面(你填你自己的页面地址).php" method="post" onsubmit="return checkpost()">
<li>用户<input type="text" name="name" class="styleinput"/></li>
<li>密码<input type="password" name="password1" class="styleinput"/></li>
<li>再次输入密码<input type="password" name="password2" class="styleinput2"/></li>
<li>年龄<input type="text" name="age" class="styleinput"/></li>
<input type="submit" value="提交" />
<input type="reset" name="submit2" value="重置"/>
</form>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
li{line-height:30px;}
.styleinput{margin-left:80px;width:150px;}
.styleinput2{margin-left:16px;width:150px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style/form.css" rel="stylesheet" type="text/css" />
<title>无标题文档</title>
<script language="JavaScript">
function checkpost()
{
if(form1.name.value=="")
{
alert("请输入用户名");
form1.name.focus();
return false;
}
if(form1.password1.value=="")
{
alert("请输入密码");
form1.password1.focus();
return false;
}
if(form1.password2.value=="")
{
alert("请再次输入密码");
form1.password2.focus();
return false;
}
if(document.form1.password1.value != document.form1.password2.value)
{
alert("您两次输入的密码不一样!请重新输入.");
document.form1.password2.focus();
return false;
}
if(form1.password2.value=="")
{
alert("请再次输入密码");
form1.password2.focus();
return false;
}
if(form1.age.value=="")
{
alert("请输入年龄");
form1.age.focus();
return false;
}
if (document.form1.age.value > 100 || document.form1.age.value < 1)
{
alert("输入的年龄不能小于0大于100!");
document.form1.age.focus();
return false;
}
alert("注册成功");
}
</script>
</head>
<body>
<div>
<form name="form1" action="动态页面(你填你自己的页面地址).php" method="post" onsubmit="return checkpost()">
<li>用户<input type="text" name="name" class="styleinput"/></li>
<li>密码<input type="password" name="password1" class="styleinput"/></li>
<li>再次输入密码<input type="password" name="password2" class="styleinput2"/></li>
<li>年龄<input type="text" name="age" class="styleinput"/></li>
<input type="submit" value="提交" />
<input type="reset" name="submit2" value="重置"/>
</form>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询