表单网页的示例
所以一个表单元素看起来是这样子的:
<form action=reg.asp method=post>
</form>
input标签在表单制作中起到的作用很重要。有10种形式,概括如下:
<input type=text />是标准的文本框。它可以有一个值属性value,用来设置文本框里的默认文本。
<input type=password /> 像文本框一样,但是会以星号代替用户所输入的实际字符。
<input type=checkbox />是复选框,用户可以快速的选择或者不选一个条目。它可以有一个预选属性checked,像这样的格式<input type=checkbox checked=checked />.
<input type=radio /> 与复选框相似,但是用户只可在一个组中选择一个单选按钮。它也有一个预选属性checked,使用方法跟复选框一 样。
<input type=file /> 是展示你电脑上的文件的一个区域,就像你在一个软件中打开或者保存一个文档一 样。
<input type=submit /> 是一个被点击后提交表单的按钮。你可以用值属性value来控制按钮上显示的文本(下面的button和reset类型也可以这样,稍后介绍),如下: <input type=submit value=Ooo. Look. Text on a button. Wow />.
<input type=image />以图像代替按钮文本,src属性是必须的,像img标签一样。
<input type=button />是一个如果没有其他代码的话什么都不做的按钮。
<input type=reset /> 是一个点击后会重置表单内容的按钮。
<input type=hidden /> 不会显示任何东西,它用来传输诸如用户正在用的页面的名字或者Email地址等表单必须传输的东西。
注意输入标签input也是用“/>”自关闭的。
多行文本输入框标签textarea基本上就是一个比较大的文本框。它必须有行属性rows和列属性cols,用法像这样:网页教学网
<textarea rows=5 cols=20>Webjx.Com welcome</textarea>
选定标签select与选项标签option一起可以制作一个下拉选框。是这样工作的:
<select>
<option value=first option>Option 1</option>
<option value=second option>Option 2</option>
<option value=third option>Option 3</option>
</select>
当表单被提交时,被选中选项的值将被发送。网页教学网
与复选框和单选按钮的预选属性checked一样,选项标签option也有一个预选属性selected,它可以用在这样的格式中:
<option value=mouse selected=selected>Rodent</option>
上述的标签中在网页中看起来都不错,但是,如果你有一个程序来处理这个表单,这些标签都不起作用。这是因为,表 单字段需要名称。所以所有的字段中都需要增加名称属性name,比如 <input type=text name=talkingsponge />。 网页教学
一个表单看起来应该像下面这样(注意:这个表单不会工作,除非有一个用来提交数据的“reg.asp”的文件,它位于表单标签form的行为属性action中。)
<form action=reg.asp method=post>
<p>Name:</p>
<p><input type=text name=name value=Your name /></p>
<p>Comments: </p>
<p><textarea name=comments rows=5 cols=20>Your comments</textarea></p>
<p>Are you:</p>
<p><input type=radio name=areyou value=male /> Male</p>
<p><input type=radio name=areyou value=female /> Female</p>
<p><input type=radio name=areyou value=hermaphrodite /> An hermaphrodite</p>
<p><input type=radio name=areyou value=asexual checked=checked /> Asexual</p>
<p><input type=submit /></p>
<p><input type=reset /></p>
</form>