一. 简答题(共1题,100分)
1. (简答题)
使用<form>、<input>、<select>、<option>、<area>等标签组合可以生成一个表单,用来与用户交互。如果再结合<table>、<tr>、<td>标签就可以制作出格式非常规范的表单。请完成一个表单的制作任务。
注意:表单提交方式使用post,联系方式长度取值范围7至11位。
选做:上网查JavaScript编程语法,当输入的用户名长度等于零,显示提示信息“用户名不能为空”;当输入的用户名长度超过15个字符时,显示提示信息“用户名长度超过15个字符,不合法!”。当输入密码长度大于8个字符时,显示提示信息“密码长度不能大于8个字符,请重新设置”。
参考样式:
正确答案:
<html>
<head>
<title>表单的建立</title>
<script language=JavaScript >
function clearfields(form)
{
form.name.value="";
form.pwd.value="";
return false;
}
function checkfields(form)
{
var vname = form.name.value;
var vpassword= form.pwd.value;
if (vname.length>15)
{
alert("用户名长度超过15个字符!");
return false;
}
else if (vname.length==0){
alert("用户名不能为空!");
return false;
}
if (vpassword.length>8)
{
alert("密码长度不能大于8个字符!");
form.pwd.value="";
return false;
}
else if (isNaN(vpassword)){
alert("密码必须为数字!");
form.pwd.value="";
return false;
}
submit1(form);
return true;
}
function submit1(form)
{
form.action="success.html";
form.submit();
}
</script>
</head>
<body >
<table border=1 align=center>
<form method=post >
<th colspan="2">用户登录表单<th>
<tr>
<td>用户名:</td>
<td><input type="text" name="name"></td>
</tr>
<tr>
<td>密 码:</td>
<td><input type="password" name="pwd" size=21></td>
</tr>
<tr>
<td>性 别:</td>
<td><input type="radio" name="gender">男
<input type="radio" name="gender">女</td>
</tr>
<tr>
<td>爱 好:</td>
<td><input type="checkbox" >打游戏
<input type="checkbox" >干饭
<input type="checkbox" >睡觉</td>
</tr>
<tr>
<td>联系方式:</td>
<td><input type="text" minlength="7" maxlength="11"></td>
</tr>
<tr align=center >
<td colspan=2 >
<input type="button" value="提 交" onclick ="checkfields(this.form)">
<input type="button" value="重 置" onclick ="clearfields(this.form)">
</td>
</tr>
</form>
</table>
</body>
</html>