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

    1.现在大多数网站的注册、登陆页面都是填写表单(Form)的形式,当用户输入了有效信息后,表单中的数据就通过HTTP协议传给后台的Web服务器,随后服务器再传回相应的信息,从而实现用户的注册与登陆过程。那么HTML表单的结构与常用属性有哪些呢?下面是笔者的一些认知:

    (1)表单的基本结构

    <html>

      <head>

      <title>标题描述文本</title>

      </head>

      <body>

        <form id="" name="" action="" method="">

        <!--表单输入控件--!>

        </form>

      </body>

    </html>

    (2)表单的常见属性及元素

    action属性与method属性。
    action属性定义一个URL,来指示表单(form)里的数据应该被发送到哪里处理。通常是一个服务器程序。
    method属性的值有两个:
    (1)GET
    GET方式将表单中的数据与实际的URL一起显示在浏览器的地址栏,对于一些隐私性高的数据,这样的方式容易泄露,不安全。如下截图,制作的一个简单的表单,采用GET方法提交数据到服务器,用户在填写完相应数据点击提交后,URL地址栏会将用户填写的信息都显示出来。

    (2 )POST方法

    对于POST方法,用一个形象的比喻来说就是:GET方法是开在地面上的公交,二POST则是在地下运行的地铁,而且对于用户来说,这个地铁是不可见的。此外,GET方法对于图片上传是有大小限制的,许多网站在要求用户上传相应图片时都有做大小限制,原因之一也许就在这,二POST方法不会有大小限制。

    (3)表单中的控件

    表单中最常见的控件就是输入控件了。包括文本框(type="text")、密码框(type="password")、单选框(type="radio")、复选框(type="checkbox")、上传控件(type="file")、提交按钮(type="submit"/ type="image" src="url")、重置按钮(type="reset")、命令按钮(type="button")、下拉列表(<select><option>选项</option></select>)等。

    要注意的是,对于单选按钮来说,要想实现单选功能,必须要把同类单选按钮的name属性设定为同一个值,ID属性值不能相同。

    如下代码:

    <fieldset>
    <legend>性别</legend>
    <input type="radio" name="gender" value="male">男</input>
    <input type="radio" name="gender" value="male">女</input>

    </fieldset>

    而对于下拉框的设置,除了上述提到的select与option的搭配之外。HTML5还提供了新的表单元素datalist。

    写法如下:

    <input type="text" list="list1"/>
    <datalist id="list1">
    <option value="湖南">湖南</option>
    <option value="湖北">湖北</option>
    <option value="广州">广州</option>
    </datalist>

    这种写法的好处在于:用户不仅可以选择,同时也可以自主输入信息。

    以上就是我个人关于表单的一些见解,如有不足之处,请大家指出,也欢迎大家交流,谢谢。

  • 相关阅读:
    iOS 5.0 后UIViewController新增:willMoveToParentViewController和didMoveToParentViewCon[转]
    数字统计(0)<P2010_1>
    数字反转(0)<P2011_1>
    质因数分解(0)<P2012_1>
    记数问题(0)<P2013_1>
    珠心算测验(0)<P2014_1>
    金币(0)<P2015_1>
    归并排序
    循环语句(while语句和do...while语句)
    循环语句(for语句的用法)
  • 原文地址:https://www.cnblogs.com/Ricky-Huang/p/4824877.html
Copyright © 2011-2022 走看看