JSP入门之表格以及常用表单元素(总结自身编程经验以及多本教科书)

本文链接：https://blog.csdn.net/GodGump/article/details/108937441

表格

开始标志:<table>
结束标志: </table>
table常用的属性：
cellpadding 规定单元格与其内容之间的空白
cellspacing 规定单元格之间的空白
border-collapse: collapse;去掉这些空白的属性,如果不设置table标签的这些属性值为0
中间是行，每行是一个<tr></tr>
每行之间是列，每一列对应 <td> </td>
<td></td> 之间的内容就是每个表格中的信息
跨行：colspan+个数
跨列：rowspan+个数

表单以及常用元素

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

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

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

input
属性type="text"表示单行文本框，用于输入少量的信息；
语法：<input type="text" name=" 名字" value=" 值">
name 指出文本框的名字，最好不要用汉字，最好使用有意义的名字；
value 指出默认值，如果没有默认值，可以不要value属性
属性type="password"表示密码框，用于输入密码
语法：<input type="password" name="名字" value="值 ">
属性type="submit"表示提交按钮：当点击它的时候，会把输入的信息提交给服务器。
语法：<input type="submit" value="值">
属性type="reset"表示复位按钮：当点击它的时候，会把各个表单元素的值恢复到默认值。
语法：<input type="reset" value="值">
属性type="button"表示普通按钮：也可以完成提交，还可以完成方法的调用。
语法：<input type="button" value="值">
属性type="radio"表示单选按钮：通用用于在多个选项中选择一个
语法：<input type="radio" name="名字" value="值">
例，选择性别：

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

如果希望在多个选项中选择一个（有互斥性），必须让他们的名字一致。
属性type="checkbox"复选框：用于多选
语法：<input type="checkbox" name="名字" value="值">

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

<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>