按钮
在表单中有四种按钮,分别是提交按钮、重置/复位按钮、图片按钮和普通按钮。它们有着不同的作用。
提交按钮的type的属性值为submit,它用来将输入的信息提交到服务器。
代码格式
<form action="" align="center">
<fieldset style="width:185px; background-color: beige;">
<p>
<input type="text" placeholder="会员名/邮箱/手机号">
</p>
<p>
<input type="password" placeholder="请输入登录密码">
</p>
<input type="submit" value="登录" style="width:175px; background-color:orangered; " >
</fieldset>
</form>
复位按钮用来重置表单。
代码格式:
<form action="">
<input type="reset" value="重置" style="width:100px;>
</form>
普通按钮用来控制其他定义了处理脚本的处理工作。
<input type="button" name="..." value="..." onclick="...">
图片按钮以图片的形式提交按钮
代码以及运行结果如下:
<form method="" action="">
<input name="submit" type="image" value="" src="images/图片按钮.jpg" />
</form>
文件域
文件域用于文件的 上传,它的type的属性值为file。
代码以及运行结果如下:
<form>
<input type="file" name="user_file" />
</form>
多行文本框
多行文本框是一种让用户自己输入内容的表单对象,用户可以输入较长的内容,长度没有限制
代码以及运行结果如下:
<form>
个人简介:<br>
<p>
<textarea rows="10" cols="30" name="txtarea">
</textarea>
</p>
</form>
复选框
复选框允许从一个选项列表中选择多个选项。在input标记中设置type属性值为checkbox。在定义选项时,要注意如果name值一样的话,用户所有选项会组合为一个数据进行提交。
代码和运行结果如下:
<form>
选择球类<br /><br />
<input type="checkbox" name="checkball" value="football" />足球<br />
<input type="checkbox" name=" checkball " value="basketball" />篮球<br />
<input type="checkbox" name=" checkball " value="pingpang" />乒乓球<br />
<input type="checkbox" name=" checkball " value="volleyball" />排球<br />
</form>