表单设计

    xiaoxiao2023-10-24  164

    表单是一个比较特殊的组件,在HTML中有着比较特殊的功能与结构。下面了解一下表单的基本元素。

    表单基本结构

        <HTML>      <HEAD>      </HEAD>      <BODY>      <form action="" method="" enctype="">      </form>      </BODY>      </HTML>

    <form>标识内必须包含属性。Action指定数据所要发送的对象文件。Method指定数据传输的方式。如果在进行上传文件等操作,还要定义enctype属性以指定数据类型。

    文本框

    <form action="formdemohandler.php" method="post">    <h3>输入一个文本信息(比如名称):</h3>    <input type="text" name="name" size="10">

    选项框

     <h3>确认此项(可复选)</h3>

       <input type="checkbox" name="acheck" checked="checked" value="1"/>

       选择此项传递的A项的value值。

       <input type="checkbox" name="bcheck" value="2"/>

       选择此项传递的B项的value值。

       <input type="checkbox" name="ccheck" value="3"/>

       选择此项传递的c项的value值。

    定义复选框之后,还要定义复选框的name属性,以确定在服务器端程序的唯一性;定义value属性,以确定此单选项所要传递的值,定义checked属性,以确定复选框的默认状态,若为checked则默认为选项,如果不定义此项,则默认为不选择。

    语句定义了复选框,定义一个input标识为复选框时需指定类型为checkbox;

    单选按钮

    <h3>单选一项:</h3>

       <input type="radio" name="aradio"value="a1"/>蓝天

       <input type="radio" name="aradio"value="a2" checked="checked"/>白云

       <input type="radio" name="aradio"value="a3"/>大海

    定义一个input标识为单选按钮时需指定类型为radio;

    定义为单选按钮之后,还需要定义单选按钮的name属性,以确定在服务器端程序的唯一性;

    定义value属性,以确定此单选按钮所要传递的值;定义checked属性,以确定单选按钮的默认状态,若为checked则默认为选项,如果不定义此项,则默认为不选择。

     

    下拉列表

    <select name="aselect"size="1">

           <option value="hainan">海南</option>

       <option value="qingdao"selected>青岛</option>

       <option value="beijing">北京</option>

       <option value="xizang">西藏</option>

    </select>

    下拉列表是<select></select>标识表示而下拉列表中的选项是通过包含在其中的<optin></option>标识表示的。

    重置按钮

    <h3>单击此按钮重置所有信息:</h3>

    <input type="RESET" value="重置">

    重置按钮是<input/>标识的一种。

    提交按钮

    <h3>单击此按钮提交所有信息到formdemohandler.php文件:<h3/>

    <input type="submit"value="提交"/>

     

     

    最新回复(0)