08-表单运用基础

表单的功能
  表单的作用是从访问您的Web站点的用户那里获得信息。访问者可以使用诸如文本域、列表框、复选框以及单选按钮之类的表单元素输入信息,然后单击某个按钮提交这些信息。
  客户端与服务器端进行信息交流的途径
表单标记
  form标记用于创建一个表单,定义表单的开始和结束,它是一个容器,用于包含其他表单元素,例如文本框、单选框等。表单元素必须入在form标记内才有作用
  <form actiopn=url(传送目标,处理表单信息的服务器端应用程序) method=处理表单数据的方法(POST/GET)如果不写method则默认提交方式为get,name=表单名称>
    表单元素
  </form>
  POST方法可以传递大量信息
  GET方法将值附加到请求该页的URL中。适合传递少量信息(默认方式)
【表单标记元素】
  单行文本框
    <input name="文本框名称" type="text" value="初始值" size="显示字符数" maxlength="做多容纳字符数" readonly="readonly"(设置为只读) disabled="disabled"(设置为不可操作) >
  密码框
    <input name="文本框名称" type="password" value="初始值" size="显示字符数" />
  多行文本框:
    <textarea name="文本框名称" cols="每行中的字符数" rows="显示的行数">
      初始内容
    </textarea>

  单选框:
    <input name="单选框名称" type="radio" value="提交值" checked="checked"(是否被选中) />

  复选框:
    <input name="复选框名称" type="checkbox" value="提交值" checked="checked" (是否被选中)>

  <label>标注内容</label>标签为 input 元素定义标注(标记)。<label>标签的 for 属性应当与相关元素的 id 属性相同
  <label for="man">男</;abel>
  <inpute type="radio" name="sex" value="man" id="man">
  列表框:

  (A)、菜单式
    <select name="列表框名称">
      <option selected="selected"(哪个为初始选择就添加)select语句[ 只有一个 ] value="提交值">列表一</option>
      <option value="提交值">列表二</option>
        .......
    </select>
  分组:<optgroup label="分组名称"></optgroup>
  (B)、列表式
    <select name="列表框名称" size="显示的行数" multiple(如果允许多选,则有该命令;否则没有此命令)>
      <option value="提交值">列表一</option>
      ......
    </select>
  例如:
    <select name="target" size="3" multiple="multiple">
      <option value="普通朋友">普通朋友</option>
      <option value="爱人" selected>爱人</option>
    </select>
  按钮:
    <input type="按钮类型"(reset)[重置按钮]、(submit)[提交表单]、(botton)[普通按钮] name="按钮名称" value="按钮显示文本" />

  图片按钮:
    <input name="图片按钮名称" type="image" src="图片路径" />

  隐藏域
    <input name="名称" type="hidden" value="提交值" />
  浏览框
    <input name="名称" type="file" size="显示长度" />

  表单外框
    <fieldset>......</fielset>定义围绕表单中元素的边框
    <legend>......</legend>legend元素为fieldset元素定义标题

****************
  1、所有的表单元素,都必须放置在表单标签中 <form>.....</form>
  2、所有的表单元素 ,以 input 为例,必须包含 type 和 name 属性
  3、有些表单元素的属性是相似的
  4、还有一些非 input 元素,作为表单元素

猜你喜欢

转载自www.cnblogs.com/xiang-liang/p/12545242.html