通俗的讲，我们用数据表存储数据，但直接对数据库的表 *** 作不方便，这样就通过表单对数据库中的表进行增,减,修改的 *** 作，也可以通过表单显示数据表中我们想要得到的数据。这就是表单最主要的作用！利用数据库存储数据，利用表单 *** 作和显示数据。
一、什么是表单表单是用于实现网页浏览者与服务器（或者说网页所有者）之间信息交互的一种页面元素，在 WWW 上它被广泛用于各种信息的搜集和反馈。
二、创建表单控件
1、文本框与口令框，HTML 代码显示了单行文本框和口令框的用法（也包含了表单中必须有的提交按钮）。
<HTML>
<HEAD><TITLE>单行文本框和口令框示例</TITLE></HEAD>
<BODY>
<DIV align="center">
<H2>表单——单行文本框和口令框</H2>
<HR>
<FORM>
请输入您的姓名：
<INPUT name="name" value="your name pls" size="30"><BR>
请输入您的密码：
<INPUT type="password" name="pwd" value="pwd" size="30"><P>
<INPUT type="submit" name="submit_button" value="提交">
</FORM>
<HR>
</DIV>
</BODY>
</HTML>
2、复选框与单选框
以下 HTML 代码显示了如何在表单中包含多个复选框和单选框。
<HTML>
<HEAD><TITLE>复选框与单选框示例</TITLE></HEAD>
<BODY><H2 align="center">表单--复选框与单选框</H2><HR>
<FORM>
请输入您的姓名：<INPUT name="name"><P>
请选择您的性别：
<INPUT type="radio" name="gender" value="1">男
<INPUT type="radio" name="gender" value="2">女
<INPUT type="radio" name="gender" value="3">东方不败
<INPUT type="radio" name="gender" value="4" checked>不告诉你<P>
请选择您的年龄：
<INPUT type="radio" name="age" value="20">20岁以下
<INPUT type="radio" name="age" value="30" checked>20~30
<INPUT type="radio" name="age" value="40">30以上<P>
您喜欢什么运动：
<INPUT type="checkbox" name="check1" value="yes" checked>篮球
<INPUT type="checkbox" name="check2" value="yes">足球
<INPUT type="checkbox" name="check3" value="yes" >排球
<INPUT type="checkbox" name="check4" value="yes" >其他球
<P align="center"><INPUT type="submit" name="submit_button" value="提交"></P></FORM>
<HR></BODY></HTML>
3、文件选择框
以下 HTML 代码显示了如何在表单中包含文件选择框。
<HTML>
<HEAD><TITLE>文件选择框示例</TITLE></HEAD>
<BODY>
<DIV align="center"><H2>表单—文件选择框</H2><HR>
<FORM>
请选择文件：<INPUT type = file name=image size=20><P>
<INPUT type="submit" name="submit_button" value="提交">
</FORM>
<HR></DIV></BODY></HTML>
4 按钮示例
以下 HTML 代码显示了如何在表单中包含各种按钮。
<HTML>
<HEAD><TITLE>按钮示例</TITLE></HEAD>
<BODY>
<DIV align="center"><H2>表单——按钮</H2><HR>
<FORM>
<INPUT type="button" name="mybutton" value="点点我试试！"
onClick="JavaScript:alert('呵呵，再点也没用！')">
<P>
<INPUT type="submit" name="submit_button" value="提交">
<INPUT type="reset" name="reset_button" value="重填">
</FORM>
<HR></DIV></BODY></HTML>
5 多行文本框
以下 HTML 代码显示了如何在表单中使用多行文本框。
<HTML>
<HEAD><TITLE>多行文本框示例</TITLE></HEAD>
<BODY>
<H2 align="center">表单——多行文本框</H2>
<HR>
<FORM>
请输入您的姓名：<INPUT><P>
请在下框内输入您的宝贵意见：<BR>
<TEXTAREA name="comments" rows="5" cols="60">请多指教！</TEXTAREA>
<P><INPUT type="image" src="mybutton.gif">
</FORM><HR></BODY></HTML>
6、选项菜单
以下 HTML 代码显示了如何在表单中使用选项菜单。
<HTML>
<HEAD><TITLE>选项菜单示例</TITLE></HEAD>
<BODY>
<H2 align="center">表单——选项菜单示例</H2><HR>
<FORM>
请输入您的姓名：<INPUT><P>
请选择您最喜欢的影视明星：
<SELECT name="yingshi">
<OPTION>周星驰 <OPTION>周润发 <OPTION>刘德华 <OPTION>其他
</SELECT>
<P>请选择您喜欢的周星驰作品（按住 "Ctrl" 或 "Shift" 可以多选）：<BR>
<SELECT name="xingxing" multiple size="4">
<OPTION>鹿鼎记 <OPTION>少林足球 <OPTION>大话西游 <OPTION>喜剧之王<OPTION>大内密探008 <OPTION>九品芝麻官 <OPTION>武状元苏乞儿 <OPTION>百变金刚 <OPTION>其他
</SELECT>
<P><INPUT type="image" src="mybutton.gif">
</FORM>
<HR></BODY></HTML>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）