zoukankan      html  css  js  c++  java
  • html表单

    html表单用于搜集不同类型的用户输入。

    表单<form>

    表单是一个包含表单元素的区域,表单元素是允许用户在表单中(例:文本域、下拉列表、单选框、复选框等)输入信息的元素。表单使用表单标签<form>定义

    <from>

    ... input 元素...

    </form>

     输入

    多数情况下被用到的表单标签是输入标签<input>,输入类型由类型属性type定义,大多数输入类型如下:

    文本域

    当用户要在表单中键入字母、数字等内容时,就会用到文本域。

    <form>

    First name:

    <input type="text" name="firstname"/>

    <br/>

    Last name:

    <input type="text" name="lastname"/>

    </form>

    浏览器显示如下:

    First name:
    Last name:

     单选按钮

    <form>

    <input type="radio" name="sex" value="male"/>Male

    <br/>

    <input type="radio" name="sex" value="female"/>Female

    </form>

    浏览器显示(注意:只能选其一):

    Male
    Female

     复选框

    当用户需要从若干给定的选择中选取一个或若干选项时,就会用复选框。

    <form>

    <input type="checkbox" name="bike"/>

    I have a bike

    <br/>

    <input type="checkbox" name="car"/>

    I have a car

    </form>

    浏览器显示如下:

    I have a bike
    I have a car

     表单的动作属性(Action)和确认按钮

    当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

    <form name="input" action="http://www.baidu.com/" method="get">

    Username: <input type="text" name="user" />

    <input type="submit" value="Submit" />

    </form>

    Username:

     下拉列表

    在html界面中创建下拉列表,下拉列表框是一个可选列表。<select><option>

    文本域

     创建按钮

    <form>
    <input type="button" value="Hello !">
    </form>

     在数据周围绘制一个带标题的框

    <form>
    <fieldset>
    <legend>健康信息</legend>
    身高:<input type="text" />
    体重:<input type="text" />
    </fieldset>
    </form>

    健康信息 身高: 体重:
    标签 描述
    <from> 定义供用户输入的表单
    <input> 定义输入域
    <textarea> 定义文本域(一个多行的输入控件)
    <label> 定义一个控制的标签
    <fieldset> 定义域
    <legent> 定义域的标题
    <select> 定义一个选择列表
    <optgroup> 定义选项组
    <option> 定义下拉列表中的选项
    <button> 定义一个按钮
  • 相关阅读:
    jquery的动画函数animate()讲解一
    用js来实现页面的换肤功能(带cookie记忆)
    Extjs换肤+cookie皮肤记忆功能
    jquery换肤
    bootstrap的alert提示框的关闭后再显示问题
    jquery.cookie中的操作
    CSS中设置margin:0 auto; 水平居中无效的原因分析
    jQuery 遍历 json 方法大全
    jquery.min.map 404 (Not Found)出错的原因及解决办法
    AJAX 跨域请求的解决办法:使用 JSONP获取JSON数据
  • 原文地址:https://www.cnblogs.com/chhom/p/4935041.html
Copyright © 2011-2022 走看看