表格

开始标志:

结束标志:

table常用的属性

cellpadding 规定单元格与其内容之间的空白

cellspacing 规定单元格之间的空白

border-collapse: collapse;去掉这些空白的属性,如果不设置table标签的这些属性值为0

中间是行,每行是一个

每行之间是列,每一列对应

之间的内容就是每个表格中的信息

跨行:colspan+个数

跨列:rowspan+个数

表单以及常用元素

form

涉及向服务器提交信息大部分情况都是在用form 。基本语法结构:

<form action="目标文件" method="get|post">
form>

action 属性决定的目标文件来对用户提交的信息进行处理。

input

属性type="text"表示单行文本框,用于输入少量的信息;

语法:

name 指出文本框的名字, 最好不要用汉字, 最好使用有意义的名字;

value 指出默认值,如果没有默认值,可以不要value属性

属性type="password"表示密码框,用于输入密码

语法:

属性type="submit"表示提交按钮:当点击它的时候,会把输入的信息提交给服务器。

语法:

属性type="reset"表示复位按钮:当点击它的时候,会把各个表单元素的值恢复到默认值。

语法:

属性type="button"表示普通按钮:也可以完成提交,还可以完成方法的调用。

语法:

属性type="radio"表示单选按钮:通用用于在多个选项中选择一个

语法:

例,选择性别:

<input type="radio" name="sex" value="1" checked><input type="radio" name="sex" value="0">

如果希望在多个选项中选择一个 (有互斥性) ,必须让他们的名字一致。

属性type="checkbox"复选框:用于多选

语法:

下拉列表:用于选择,可以单选,也可以多选。基本语法格式:

<select name="	名字">
<option value="1" selected>内容option>
<option value="2">内容option>
...
select>

每个选项使用一个 option ,使用 value 属性指出该选项的值,在

和 之间是显示给用户的值。

文本域:用于输入大量的信息。基本语法格式:

<textarea name="名字" cols="列数" rows="	行数">
默认值
textarea>

要为这个文本域赋默认值,需要把值放在开始标志和结束标志之间, 而不是使用 value属性。

设计表单输入的时候应该注意的问题

能够从系统中获取的信息不要让用户提供,例如当前时间。

能够选择的信息不要让用户输入。

按照信息的重要程度安排表单元素在界面中的位置。

对用户输入信息进行验证

要用 JavaScript ,使用下面的标记:

<script language="javascript">
//JavaScript	代码
</script>

要写方法

function check(){
}

和编程语言一样:方法可以不用定义返回值,但是可以有返回值

获取用户输入的值:

document.formX.username.value

document表示当前文档,formX表示表单的名字, username表示该表单中表单元素的名字, value表示得到值

把表单提交与方法关联:可以使用表单的onSubmit事件。

例:

<script language="javascript"> function check(){
username = document.form1.username.value;
if(username.length<6 || username.length>8){ alert("	用户名长度不合适!	");
return false;
}else{
return true;
}
}
</script>

接下来把提交按钮修改成普通按钮;

在普通按钮上增加事件:onClick=“javascript:check()”

在验证成功的时候,提交表单: document.form1.submit();


本文由转载于互联网,如有侵权请联系删除!