4.复习笔记(这个就是课后习题以及课程所呈现的需求)
①首先建立表单,然后检查是否选择了爱好,再检查密码位数是否是8位以上,再检查两个密码是否一致,最后检查备注会否为空. 注:个人觉得备注为空是允许的,这里只是教我们编程的例子.
5.自测代码
2.课堂笔记
(
1).首先按照要求进行表单设置,年龄,爱好,密码,备注,并设置备注行数为
4行,列数为
10列.
年龄:输入数字
爱好: 爬山 游泳 网球 乒乓球
至少选择一个
密码:输入两次,两次必须一致,且密码长度必须大于
8
备注:用textarea
html代码
<body>
<form name=
"f1">
姓名:<input
type="text" name=
"xm"><br />
年龄:<input
type="text" name=
"n1"><br />
爱好:<input
type="checkbox" name=
"ah">爬山<input
type="checkbox" name=
"ah">游泳<input
type="checkbox" name=
"ah">网球<input
type="checkbox" name=
"ah">乒乓球<br />
密码<input
type="password" name=
"mm"><br />
重复密码<input
type="password" name=
"cfmm"><br />
备注:<textarea name=
"bz" rows=
"4" cols=
"10"></textarea>
<input
type="button" value=
"提交"><br />
</form>
</body>
(
2)接下来进行编程
首先判断爱好全不选是不行的,密码长度小于
8是不行的,两次密码输入不一致
<body>
<form name=
"f1">
姓名:<input
type="text" name=
"xm"><br />
年龄:<input
type="text" name=
"n1"><br />
爱好:<input
type="checkbox" name=
"ah">爬山<input
type="checkbox" name=
"ah">游泳<input
type="checkbox" name=
"ah">网球<input
type="checkbox" name=
"ah">乒乓球<br />
密码<input
type="password" name=
"mm"><br />
重复密码<input
type="password" name=
"cfmm"><br />
备注:<textarea name=
"bz" rows=
"4" cols=
"10"></textarea><br />
<input
type="button" value=
"提交" onClick=
"checkit();"><br />
</form>
</body>
function checkit()
{
var flag=
false;
for(var i=
0;i<document.forms[
0].ah.length;i++)
{
if(document.forms[
0].ah[i].checked)
{
flag=
true;
break;
}
}
if(!flag)
{
alert(
"请至少选择一个爱好");
return;
}
if(document.forms[
0].mm.value.length<
8)
{
alert(
"密码长度必须在8位以上");
document.forms[
0].mm.focus();
return;
}
if(document.forms[
0].mm.value!=document.forms[
0].cfmm.value)
{
alter(
"两次密码输入不一致!");
document.forms[
0].cfmm.focus();
cfmm;
}
}
(
3)接下来同样的,检查备注是否为空
if(document.forms[
0].bz.value==
"")
{
alert(
"请输入备注!");
}
这个代码是直接加在检查密码不一致后面的.
3.课程效果图
1.代码