表单 订阅
表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。 展开全文
表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。
信息
对    象
文本框,密码框等
控件分类
Button Objx,Input Pro等
作    用
采集数据
中文名
表单
组    成
表单标签、表单域、表单按钮
外文名
Form
表单代码
功能:用于申明表单,定义采集数据的范围,也就是
里面包含的数据将被提交到服务器或者电子邮件里。语法:
. . .
属性解释见下表:action=url用来指定处理提交表单的格式.它可以是一个URL地址(提交给程式)或一个电子邮件地址.method=get或post指明提交表单的HTTP方法.可能的值为: post:POST方法在表单的主干包含名称/值对并且无需包含于action特性的URL中. get:不赞成。GET方法把名称/值对加在action的URL后面并且把新的URL送至服务器.这是往前兼容的缺省值.这个值由于国际化的原因不赞成使用.enctype=cdata指明用来把表单提交给服务器时(当method值为"post")的互联网媒体形式.这个特性的缺省值是"application/x-www-form-urlencoded"TARGET="..."指定提交的结果文档显示的位置: _blank :在一个新的、无名浏览器窗口调入指定的文档; _self :在指向这个目标的元素的相同的框架中调入文档; _parent :把文档调入当前框的直接的父FRAMESET框中;这个值在当前框没有父框时等价于_self; _top :把文档调入原来的最顶部的浏览器窗口中(因此取消所有其它框架);这个值等价于当前框没有你框时的_self.例如:表示表单将向以post的方式提交,提交的结果在新的页面显示,数据提交的媒体方式是默认的application/x-www-form-urlencoded方式;表单域表单域包含了文本框、多行文本框、密码框、隐藏域、复选框、单选框和下拉选择框等,用于采集用户的输入或选择的数据,下面分别讲述这些表单域的代码格式:文本框是一种让访问者自己输入内容的表单对象,通常被用来填写单个字或者简短的回答,如姓名、地址等。代码格式:属性解释:type="text"定义单行文本输入框;name属性定义文本框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;size属性定义文本框的宽度,单位是单个字符宽度;maxlength属性定义最多输入的字符数。value属性定义文本框的初始值样例1:样例1代码:也是一种让访问者自己输入内容的表单对象,只不过能让访问者填写较长的内容。代码格式:属性解释:name属性定义多行文本框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;cols属性定义多行文本框的宽度,单位是单个字符宽度;rows属性定义多行文本框的高度,单位是单个字符宽度;wrap属性定义输入内容大于文本域时显示的方式,可选值如下:默认值是文本自动换行;当输入内容超过文本域的右边界时会自动转到下一行,而数据在被提交处理时自动换行的地方不会有换行符出现; Off,用来避免文本换行,当输入的内容超过文本域右边界时,文本将向左滚动,必须用Return才能将插入点移到下一行; Virtual,允许文本自动换行。 Physical,让文本换行,当数据被提交处理时换行符也将被一起提交处理。样例2:样例2代码:是一种特殊的文本域,用于输入密码。当访问者输入文字时,文字会被星号或其它符号代替,而输入的文字会被隐藏。代码格式:属性解释:type="password"定义密码框;name属性定义密码框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;size属性定义密码框的宽度,单位是单个字符宽度;maxlength属性定义最多输入的字符数。样例3:样例3代码:隐藏域是用来收集或发送信息的不可见元素,对于网页的访问者来说,隐藏域是看不见的。当表单被提交时,隐藏域就会将信息用你设置时定义的名称和值发送到服务器上。代码格式:属性解释:type="hidden"定义隐藏域;name属性定义隐藏域的名称,要保证数据的准确采集,必须定义一个独一无二的名称;value属性定义隐藏域的值例如:复选框允许在待选项中选中一项以上的选项。每个复选框都是一个独立的元素,都必须有一个唯一的名称。代码格式:属性解释:type="checkbox"定义复选框;name属性定义复选框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;value属性定义复选框的值样例4:样例4代码:xxxcom当需要访问者在单选项中选择唯一的答案时,就需要用到单选框了。代码格式:属性解释:type="radio"定义单选框;name属性定义单选框的名称,要保证数据的准确采集,单选框都是以组为单位使用的,在同一组中的单选项都必须用同一个名称;value属性定义单选框的值,在同一组中,它们的域值必须是不同的。样例5:样例5代码:有时候,需要用户上传自己的文件,文件上传框看上去和其它文本域差不多,只是它还包含了一个浏览按钮。访问者可以通过输入需要上传的文件的路径或者点击浏览按钮选择需要上传的文件。注意:在使用文件域以前,请先确定你的服务器是否允许匿名上传文件。表单标签中必须设置ENCTYPE="multipart/form-data"来确保文件被正确编码;另外,表单的传送方式必须设置成POST。代码格式:属性解释:type="file"定义文件上传框;name属性定义文件上传框的名称,要保证数据的准确采集,必须定义一个独一无二的名称;size属性定义文件上传框的宽度,单位是单个字符宽度;maxlength属性定义最多输入的字符数。样例6:样例6代码:下拉选择框允许你在一个有限的空间设置多种选项。代码格式:属性解释:size属性定义下拉选择框的行数;name属性定义下拉选择框的名称;multiple属性表示可以多选,如果不设置本属性,那么只能单选;value属性定义选择项的值;selected属性表示默认已经选择本选项。样例7:样例7代码:样例8:按Ctrl可以多选样例8代码:表单按钮控制表单的运作。1.3.1 提交按钮提交按钮用来将输入的信息提交到服务器。代码格式:属性解释:type="submit"定义提交按钮;name属性定义提交按钮的名称;value属性定义按钮的显示文字;样例9:样例9代码:1.3.2 复位按钮复位按钮用来重置表单。代码格式:属性解释:type="reset"定义复位按钮;name属性定义复位按钮的名称;value属性定义按钮的显示文字;样例10:样例10代码:1.3.3 一般按钮一般按钮用来控制其他定义了处理脚本的处理工作。代码格式:属性解释:type="button"定义一般按钮;name属性定义一般按钮的名称;value属性定义按钮的显示文字;onClick属性,也可以是其它的事件,通过指定脚本函数来定义按钮的行为;样例11:样例11代码:二.表单表单是用来提交资料、意见,规范流程执行过程的格式。
收起全文
精华内容
参与话题
问答
  • html表单

    千次阅读 多人点赞 2018-08-30 21:32:08
    1.1 表单标签作用: 作用:将客户端的数据提交给服务器,(表单是客户与服务器交互的一种方式)。 可见性:在网页上是不可见的。 1.2 form常用的属性: form标签是表单标签的一个根标签。 常用属性 作用...

    1.1 表单标签作用

    1. 作用:将客户端的数据提交给服务器,(表单是客户与服务器交互的一种方式)。
    2. 可见性:在网页上是不可见的。

    1.2 form常用的属性

     form标签是表单标签的一个根标签

    常用属性 作用
    action 提交给服务器的地址
     method 提交数据给服务器的方式,主要有两种方式:GET(默认)或POST

    1.3 GET与POST在格式上的区别

    提交方法 特点
    GET

    默认是GET方式,参数跟在地址栏后面,以?隔开。多个参数之间以&符号分隔,安全性低

    POST 参数在地址栏是不可见的,安全性更高。
    GET 提交的数据有大小限制,不能超过1kb。
    POST 提交的数据是没有大小限制的。
    • 注意:GET提交的数据有大小限制,原则上不能超过1kb。但是实际上,某些浏览器厂商并未遵守这个规范,有些超过了1kb,不同的厂商各有不同。

     1.4 案例:表单标签的应用

     1.4.1 案例需求

    结合表格布局,制作如图所示的注册页面。

    1.4.2 案例效果

     1.4.3 案例分析

    1. 整个表单由8行2列组成,第1行显示文本,可以在td中使用label标签。
    2. 用户名、密码、性别、爱好、照片使用input标签,设置不同的type属性。
    3. 学历使用select,个人简介使用textarea
    4. 最后1行跨2列,注册、清空、按钮的type分别是submit、reset、button

     

    • 表单的根标签是一个:form标签
    • form表单常用的属性:
    1. action:指定表单提交的服务器地址。
    2. method:指定表单的提交方式get/post,默认是get方式。 
    • 注意事项
    1. 任何一个表单项如果没有name的属性值都不允许提交。
    2. 如果一个表单项可以输入数据,那么可以没有value属性值,如果不能输入数据,那么一定要存在value属性值,提交的时候是提交了value属性值
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>用户注册案例</title>
        <style type="text/css"></style>
        <script type="text/javascript"></script>
    </head>
    <body>
    <form action="http://www.baidu.com" method="get">
        <table width="400px" height="400px">
            <tr>
                <!--colspan:单元格跨几列-->
                <td colspan="2">
                    <h4>用户注册</h4>
                    <hr/>
                </td>
            </tr>
    
    
            <!--隐藏表单项,应用场景:某些数据对用户而言是没有意义的,用户不需要看到这些数据,但是服务器又需要,那么这-->
            <!--时候就可以使用隐藏表单项-->
            <input type="hidden" name="flag" value="true"/>
    
            <tr>
                <td>用户名:</td>
                <td>
                    <!--用户名:普通文本输入框-->
                    <input type="text" name="useName" value="请输入用户名..."/>
                </td>
            </tr>
    
            <tr>
                <td>密码:</td>
                <td>
                    <!--密码:密码框-->
                    <input type="password" name="password"/>
                </td>
            </tr>
    
            <tr>
                <td>性别:</td>
                <td>
                    <!--性别:单选框,单选框input标签,type=radio 同一组的单选框只能选择其中一个
                      单选框如果需要分组,那么必须保持name的属性值一致。如果需要默认选中某一个,那么需要添加
                      checked属性-->
                    男:<input type="radio" name="sex" value="man" checked/>
                    女:<input type="radio" name="sex" value="woman"/>
                </td>
            </tr>
    
            <tr>
                <td>爱好:</td>
                <td>
                    <!--兴趣爱好:复选框-->
                    游泳:<input type="checkbox" name="hobbit" value="swimm"/>
                    上网:<input type="checkbox" name="hobbit" value="surf"/>
                    电影:<input type="checkbox" name="hobbit" value="movie"/>
                    看书:<input type="checkbox" name="hobbit" value="read"/>
                </td>
            </tr>
    
            <tr>
                <td>学历:</td>
                <td>
                    <!--学历:下拉框,下拉框使用的是select标签-->
                    <select name="education">
                        <option value="bs">博士</option>
                        <option value="ss">硕士</option>
                        <option value="bk">本科</option>
                        <option value="dz">大专</option>
                    </select>
                </td>
            </tr>
    
            <tr>
                <td>照片:</td>
                <td>
                    <!--照片:文件表单项-->
                    <input type="file" name="image"/>
                </td>
            </tr>
    
            <tr>
                <td>个人简介:</td>
                <td>
                    <!--个人简介:文本域 标签:textarea-->
                    <textarea  cols="40" rows="10" name="intr"></textarea>
                </td>
            </tr>
    
            <tr align="center">
                <!--colspan:单元格跨几列-->
                <td colspan="2">
                    <!--普通按钮-->
                    <input type="button" value="普通按钮"/>
                    <!--重置表单项-->
                    <input type="reset" value="重置"/>
                    <!--提交按钮:提交表单的数据到服务器上-->
                    <input type="submit" value="注册"/>
                </td>
            </tr>
    
        </table>
    </form>
    </body>
    </html>

     

     1.5 常用的表单控件

    表单项 控件代码 属性 备注
    文本框

    <input type="text" name="名字">

    type:控件的类型

    name:名字,给服务器使用

    value:默认值

    readonly:文本框只读

    disabled:文本框不可用,数据不能提交给服务器

    placeholder:文本框输入前提示文字

    如果没有指定type类型,默认是text

    密码框

    <input type="password">

    属性同上 输入的字符不可见
    单选框

    <input type="radio" name="gender" value="男" checked="checked"> 

    checked:默认选中

    value:指定选中这一项的值,如果没有指定,默认是on

    同一组的单选框只能选择其中一个,单选框如果需要分组,那么必须保持name的属性值一致。如果需要默认选中某一个,那么需要添加checked属性
    复选框

    <input type="checkbox" name="hobby" value="游泳">

    checked:选中

    value:选中这一项的值

    下拉列表

    <select> 容器

    默认是单选

    多选

     

    name:给服务器使用的名字

    multiple:多选

    size:指定多选的时候大小

     
    <option>代表其中一项

    value:选中这一项的值

    selected:默认选中

     
    隐藏表单 <input type="hidden" name="id"  value="值">

    name:给服务器使用的名字

    value:隐藏域的值

    表单上不可见,可以将数据提交给服务器,一般用于一些不需要用户看到的数据。
    文本域

    <input type="file" name="photo" accept="image/*">

    accept:指定文件类型

    如:image/*

     
    多行文本域

    <textarea name="intro" cols="50" rows="5"></textarea>

    rows:指定显示的行数

    cols:指定显示的列数

    注:没有value值,主体部分就是它的值。
    提交按钮

    <input type="submit" value="注册"/>

    <button>按钮文字</button>

    value:按钮上出现的文字

    button:标签是一个专门按钮

    也可以指定type类型,默认是提交按钮

    将整个表单提交给服务器
    重置按钮

    <input type="reset" value="重置"/>

      还原到开始状态
    普通按钮

    <input type="button" value="按钮"/>

      在表单中没有具体的功能,主要用于后期程序开发
    图片按钮

    <input type="image" src="img/regbtn.jpg">

    x,y:点击在图片上的坐标 具有与submit相同的功能

    1.6 html5新添加type属性

    描述
    color 定义拾色器
    date 定义日期字段(带有calendar控件)
    datetime-local 定义日期字段(带有calendar和time控件)
    month 定义日期字段的月(带有calendar控件)
    week 定义日期字段的周(带有calendar控件)
    time 定义日期字段的时分秒(带有time控件)
    email 定义用于e-mail地址的文本字段,如果输入不正确的邮箱地址有验证的功能
    number 定义带有spinner控件的数字字段
    range 定义带有slider控件的数字字段
    search 定义用于搜索的文本字段,**当输入内容的时候,搜索框后边会自动出现一个小X,点击这个小X,可以清除输入的内容。**
     tel 定义用于电话的文本字段,在手机上操作会出现输入数字的键盘。
    URL 定义用于URL的文本字段,在手机上操作会出现输入网址的键盘。
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style type="text/css"></style>
        <script type="text/javascript"></script>
    </head>
    <body>
    <form action="http://www.baidu.com">
        你喜欢的颜色:<input type="color" name="color"/><br/>
        生日:<input type="date" name="birthday"/><br/>
        邮箱:<input type="email" name="email"/><br/>
        手机:<input type="tel" name="tel"/><br/>
        <input type="submit" value="注册"/>
    </form>
    </body>
    </html>

    更多资料,搜索或扫码关注公众号:数说Cloud

     

    展开全文
  • HTML-表单(非常详细)

    万次阅读 多人点赞 2018-08-31 10:41:24
    表单语法 &lt;form method="post"(规定如何发送表单数据 常用值:get|post) action="result.html"&gt;(表示向何处发送表单数据) &lt;p&gt; 名字:&lt;input name=&...

     

    表单语法

    <form  method="post"(规定如何发送表单数据      常用值:get|post)
     action="result.html">(表示向何处发送表单数据)
       <p>  名字:<input name="name" type="text" >  </p>
       <p>  密码:<input name="pass" type="password" >  </p>
       <p>
          <input type="submit" name="Button" value="提交"/>
          <input type="reset" name="Reset" value="重填“/> 
       </p>
    </form>
    

    经验:在实际网页开发中通常采用post方式提交表单数据

     

    表单元素格式

    语法:

    <input  type="text"(input元素类型)name="fname"(input元素名称) 
    value="text"(input元素的值)/>
    

    属性

    说明

    type

    指定元素的类型textpasswordcheckboxradiosubmitresetfilehiddenimage button默认为 text

    name

    指定表单元素的名称

    value

    元素的初始值type radio必须指定一个值

    size

    指定表单元素的初始宽度 type text password,表单元素的大小以字符为单位。对于其他类型,宽度以像素为单位

    maxlength

    typetext password 时,输入的最大字符

    checked

    typeradiocheckbox时,指定按钮是否是被选中

     

    表单元素

    文本框-语法

    <input  type="text"(文本框)  name="userName"(文本框名称) value="用户名"(文本框初始值) size="30"(文本框长度) maxlength="20"(文本框可输入最多字符) />
    

    密码框-语法

    <input  type="password "(密码框)  name="pass"(密码框的名称)  size="20"(密码框的长度) />
    

    单选按钮-语法

    <input name="gen" type="radio"(单选按钮框) value="男"(值)  checked(单选按钮选中状态)  />男
    <input name="gen" type="radio" value="女" />女
    

    复选框-语法

    <input type="checkbox"(复选框) name="interest" value="sports"(值)/>运动
    <input type="checkbox" name="interest" value="talk" checked(复选框选中状态) />聊天
    <input type="checkbox" name="interest" value="play"/>玩游戏
    

    列表框-语法

    <select(列表框) name="列表名称" size="行数">
    <option value="选项的值" selected="selected"(默认选中项)>…</option >
    <option(选项) value="选项的值">…</option >
    </select>
    

    按钮-语法

    <input type="reset" (重置按钮) name="butReset"  value="reset按钮"(按钮上显示的文字)>
    <input type="submit"(提交按钮) name="butSubmit" value="submit按钮">
    <input type="button"(普通按钮) name="butButton" value="button按钮"/>
    
    
    图片按钮
    
    <input type="image" src="images/login.gif"/(图片路径)>

    多行文本域-语法

    <textarea(多行文本域)  name="showText"  cols="x"(显示的列数)  rows="y"(显示的行数)>文本内容 </textarea  >
    

    文件域-语法

    <form action="" method="post" enctype="multipart/form-data"(表单编码属性)>
      <p><input type="file"(文件域) name="files" />
      <input type="submit" name="upload" value="上传" /></p>
    </form>
    

    邮箱-语法

    <p>邮箱:<input type="email"(邮箱)  name="email"/></p>
    <input type="submit"/>
    

    注意:会自动验证Email地址格式是否正确

    网址-语法

    <p>请输入你的网址:<input type="url"(网址)  name="userUrl"/></p>
    <input type="submit"/>
    

    注意:会自动验证URL地址格式是否正确

    数字-语法

    <p>请输入数字:<input type="number"(数字)  name="num" min="0"(允许的最小值) max="100"(允许的最大值) step(合法的数字间隔)="10"/></p>
    <input type="submit"/>
    

    滑块-语法

    <p>请输入数字:<input type="range"(滑块)  name="range1" min="0"(允许的最小值) max="10"(允许的最大值) step(合法的数字间隔)="2"/></p>
    <input type="submit"/>
    

    搜索框-语法

    <p>请输入搜索的关键词:<input type="search"(搜索框)  name="sousuo"/></p>
    <input type="submit"/>
    

     

    表单的高级应用

    隐藏域-语法

    <input type="hidden"(隐藏域) value="666" name="userid">
    

    只读和禁用-语法

    <input name="name" type="text" value="张三"  readonly(只读文本框)>
    <input type="submit "  disabled (禁用)  value="保存" >
    

    表单元素的标注

    1.增强鼠标的可用性

    2.自动将焦点转移到与该标注相关的表单元素上

    语法

    <label for="id"(表单元素的id)>标注的文本</label>
    <input type="radio" name="gender" id="male"/(表单元素id)>
    

     

    表单的初级验证

    表单验证的好处

            1.减轻服务器的压力

            2.保证数据的可行性和安全性

    表单初级验证的方法

           1.placeholder                   2.required                       3.pattern

    placeholder

               1.input类型的文本框提供一种提示(hint

               2.可以描述文本框期待用户输入何种内容

               3.提示语默认显示当文本框中输入内容时提示语消失

               4.适合于input标签:textsearchurlemailpassword等类型

    语法:

    <input type="search" name="sousuo"  placeholder(文本框输入内容提示)="请输入要搜索的关键字"/>
    

     

    required

               1.规定文本框填写内容不能为空,否则不允许用户提交表单

               2.适合于input标签textsearchurlemailpasswordnumbercheckboxradiofile等类型

    语法:

    <input type="text" name="username"  required/(必填项)>
    

    pattern

             用户输入的内容必须符合正则表达式所指的规则,否则就不能提交表

    语法:

    <input type="text" name="tel"  required pattern(验证规则,正则表达式)="^1[358]\d{9}" />
    

         

     

    展开全文
  • html中form表单的使用方法和介绍

    万次阅读 多人点赞 2017-10-04 09:43:33
    form表单的使用方法 第1节、表单赏析 第2节、了解表单 功能:用于搜集不同类型的用户输入的内容   有了表单,网页的内容可以由用户自己创建,那么对于网页来说,我们既是网页创建都者,也是网页的消费者。 ...
    form表单的使用方法

    一、表单赏析



    二、了解表单

    功能:用于搜集不同类型的用户输入的内容

     

    有了表单,网页的内容可以由用户自己创建,那么对于网页来说,我们既是网页创建都者,也是网页的消费者。

    三、常用的表单元素

    ü  form   表单

    ü  input   表单元素,表单项

    ü  select和option  下拉菜单

    ü  textarea 文本域

     

    (1)form元素

    功能:用于创建一个表单

    格式:<form></form>

     

    基本用法:


    重要属性:

    1,action:表示当前表单中的内容提交给哪个页面进行处理

    2,method:表示当前表单提交的方式,常见的有get和post方式,默认是get提交

     

    (2)input元素

    表示输入框,有多种形式,可以根据type属性来确定显示哪种输入框。


    基本用法:


    效果 :


    注意细节:

    1,对于input来说,它的type的默认值是text,表示单行文本

    2,对于input,最好给它添加一个name属性,作用是用于将用户输入的内容提交给要处理这个数据的页面

     

    GET提交与POST提交:

     

    GET:


    如果以get方式进行提交,但没有写上name属性,那么用户输入的内容是提交不了的,但是也会出现?这个标志:


    POST:

    当用户以post方式提交时,用户输入的内容不会放到地址栏里面,比较安全:


    GET和POST小结:

    1,GET会将用户输入的内容放到地址栏里面,使用GET请求不安全

    2,POST不会将用户输入的内容放到地址栏里面,相对安全

     

    细节:

    1,每一个input标签都有一个value属性,不同类型的input, value的作用也不同

    对于type=”text”来说,value可有可无,因为用户输入的内容都可以提交过去。

    对于type=”radio”或type=”checkbox”来说,没有value,是提交不了的。


    2,对于type=”radio”来说,如果你只想选择一个,需要给每个input添加一个name属性,属性值也必须一致,如果不添加,就不能满足单选框的需求。

     

    3,关于单行文本的宽度,可以使用size属性来设置,表示字符长度,实际上不用,我们一般是通过CSS进行控制的。

     

    (3)select和option

    作用:用来实现下拉列表

     

     

    格式:<select>

    <option>内容</option>

    <option>内容</option>

    <option>内容</option>

    </select>

     

    基本用法:


    注意点:

    1,默认情况下,提交时,它将option里面的内容作为提交的内容,但是通常我们不这样做,我们通常给opton设置一个value属性,属性值我们通常用数字。


    使用value后的情况如下:


     

    我们可以使用selected属性让某个option处理默认选中状态。


     

    (3)textarea

    作用:提供输入大量文本的输入框,比如,QQ空间中发表状态,贴吧发表贴子等。

    格式:<textarea></textarea>

     

    基本用法:



    展开全文
  • from表单应用

    2019-04-08 09:06:47
    今天,我们来学习from表单的应用,首先,我们要知道from的两个属性action和method,前者表示规定表单提交时向何处发生表单数据,后者规定了表单提交的方式,简单的说就是前者是地址,后者是方式,而提交的方式有两种...

    今天,我们来学习from表单的应用,首先,我们要知道from的两个属性action和method,前者表示规定表单提交时向何处发生表单数据,后者规定了表单提交的方式,简单的说就是前者是地址,后者是方式,而提交的方式有两种,分别是get和post,而这两者的区别就是,使用get提交时,参数直接暴露在URL上,如图一所示,在这里插入图片描述
    图一 get提交
    在这里插入图片描述
    图二post提交
    与post相比呢get更简单也更快,并且能在大部分情况下使用,当时在下列情况中请使用post,无法使用缓存文件(更新服务器上的文件或数据库),向服务器发送大量数据(POST没有数据量限制),发送包含未知字符的用户输入时,post比get也更稳定和更可靠,get/post的区别有点
    1、Get方法是用来向服务器上获取数据,而post是用来向服务器上传递修改数据。
    2、Get将表单里的数据添加到action所指向的URL后面,并且两者之间使用“?”连接,而各个变量之间使用“&”连接;post是将表单中的数据放在form的数据体中,按照变量和值对象的方式,传递到所指向的action。
    3、Ger是不安全的,因为在传输过程中,数据被放在请求的URL中,这样,用户就可以直接在浏览器上看到提交的数据,一些系统内部信息也一同显示在用户面前。Post的所有操作对于用户来说都是不可兼得。
    4、Get传输的数据量小,主要所限与URL长度限制,其中IE浏览器对URL的最大限度为2083个字符。
    5、Form提交默认为get方法提交。
    6、Get方式获取数据后,刷新不会有负面的影响,因为它只是获取数据,而post方法刷新页面重复提交可能会产生不良的后果。
    然后,获取表单元素的三种方式:
    1、第一种FormCollection form (提交方式为post)
    2、第二种Request.Form[“txtName”];taxtName为表单元素中name属性的值(提交方式为post)
    3、第三种用post或get也可以,是设置参数,然后来接受,是最常见和最常用的一种。
    Form的基本应用就是这些,希望对同学们有帮助。

    展开全文
  • HTML5 表单

    2019-05-13 08:25:48
    1、表单作用 收集用户的信息并提交给服务器 2、表单的要素 form元素:收集用户的信息 表单控件:可以与用户进行数据交互的可视化组件 form元素 &lt;form&gt;&lt;/form&gt; 属性: 属性 取值 ...
  • 表单

    2020-03-03 17:33:05
    2.表达的构成:表单域,表单控件,提示信息 3.表单域,3个属性是与服务器交互用的 4.表单元素分类 5.input元素,单标签 type的属性值 其他属性 checked打开页面默认选中 例子: <form ...
  • 表单的初始介绍

    2020-11-19 21:42:10
    表单 收集不同类型的用户输入 form 表单区域 <form> 表单元素 </form> 申明表单区域 表单元素 input类型 空元素 <input type="input类型"> text 单行文本输入框 password 密码域(默认...
  • 表单及表格

    2019-04-01 16:04:51
    表单介绍 表单的概念: 表单是用来收集用户的信息或是数据 1、提交按钮、重置按钮、普通按钮 <form > <!--提交按钮将数据提交到指定位置--> <input type="submit"value="提交按钮" /><!--...
  • 表格 表单

    2020-11-18 14:25:26
    表格 作用:展示数据,不是布局页面 table标签:定义表格 (caption:定义表格标题,自带居中加粗,紧跟在table标签后,每个
  • 什么表单:组成: 一个表单有三个基本组成部分: 1) 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 2) 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框...
  • HTML 表单(form) 使用详解

    万次阅读 2015-05-31 09:48:34
    一、表单  1.表单的作用  HTML 表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户与Web服务器的交互。  2.表单的工作机制    3.表单定义(标签)  HTML...
  • form表单提交的几种方式

    万次阅读 多人点赞 2019-06-04 09:41:03
    表单提交方式一:直接利用form表单提交 html页面代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Insert title here</title> </head> &...
  • HTML表单

    千次阅读 2018-07-28 22:50:26
    HTML表单用于搜集不同类型的用户输入。  表单的一系列操作都要定义在&lt;form&gt;标签内,就像表格要定义在&lt;table&gt;标签中一样。 1. &lt;input&gt;标签  表单由表单元素组成,...
  • HTML 表单制作

    千次阅读 2019-09-19 20:36:11
    HTML 表单 用于收集不同类型的用户输入。 表单是一个包含表单元素的区域 表单元素是允许用户在表单中输入内容, 比如:文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等 表单使用...
  • html表单,表单域

    千次阅读 2018-08-21 19:57:58
    一,基本的表单标签及属性   input 标签 输入表单 属性:text 定义输入文本  radio定义单选按钮 同组单选按钮 name属性值必须统一 这样才能实现单选,(checked="checked"可以设定初始值)  checkbox...
  • HTML表单 和 表单域

    千次阅读 2017-09-05 14:16:11
    一、什么是表单? 收集用户信息的一个容器,相当于点餐时的菜单... 表单中包含表单域(文本框、密码框、按钮 都属于表单域) 定义表单的语法: 表单域 常用的属性 1.action 用来处理请求的页面或程序...
  • html 表单验证

    千次阅读 2018-12-07 12:31:36
    我采用的表单验证不是使用 框架来实现,而是直接使用 html5 的新特性 1. 实现一个简单的用户名长度验证 我想实现表单验证,但是写js又太麻烦,有没有简单实用又灵活的方法 需求:用户名限制长度...
  • 垂直布局的HTML表单

    千次阅读 2018-02-23 22:01:51
    垂直布局的表单对于比较复杂的表单,要填写的内容相对较多,采用水平布局显然不合适。因此,垂直布局的表单更加常用。垂直对齐的表单中,标签和输入框可以使用三种对齐方式,包括顶对齐、左对齐和右对齐。CSS 顶对齐...
  • HTML 表单

    千次阅读 2019-05-16 00:07:13
    前端开发html5表单测试 以下进行了一个简单的表单测试利用了fieldset标签将表单内容的一部分打包,生成一组相关表单的字段。当一组表单元素放到 fieldset 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的...
  • 弹出隐藏的HTML表单

    万次阅读 2018-02-23 22:02:49
    弹出隐藏的表单大多数情况下,表单会直接显示在页面上,但并非总是如此。比如,一些购物网站,允许用户把商品加入购物车,当提交订单时,再检测用户是否登录,如果没有登录,则弹出登录界面,供用户登录。弹出表单的...
  • 56款超赞的国外html表单模板

    千次阅读 2018-12-27 11:11:41
    如果你正在寻找有趣的表单模板,那你找...下载地址:http://www.177347.com/view-105-36037-0.html  2、【网页响应式开发】带我进入登录框表单模板 大小:655 KB 下载地址:http://www.177347.com/view-105-36040-...
  • HTML 表单按钮

    万次阅读 2018-04-13 20:11:53
    表单按钮表单按钮一般分为三类,分别是提交按钮、重置按钮和普通按钮。提交按钮、重置按钮只能在表单中使用,普通按钮则可以在网页的任何地方使用。从本质上讲,表单按钮也是表单控件,之所以把它分离出来,单独介绍...
  • HTML表单之邮箱验证

    万次阅读 2018-10-16 17:36:41
    学习HTML表单是一个很重要的知识,而表单最常用的可能就是表单的验证了;下面我介绍验证邮箱的一种方法。
  • html表单整理,实例

    千次阅读 2018-11-16 10:26:33
    首先通过一个实例来表明表单的一些基本的使用,然后详细讲解表单里面的属性,最后再做出总结。   接下来解析上面的例子  1、表单的作用:用来搜集不同类型的用户输入 2、&lt;form action="#" ...
  • HTML简单注册界面——含表单验证

    万次阅读 多人点赞 2018-10-28 14:43:47
    最近学习HTML表单,感慨万千。虽然看起来好像不难学,但要是真自己实践起来问题却多多。这里是我写的一个简单的注册页面,只有“注册账号、密码、重输密码”三个文本框,还包含了原生JavaScript验证。(记一下,也...
  • 动态生成html表单并提交

    千次阅读 2017-12-18 08:33:40
    之前在做一个问卷调查的时候,用到了动态生成html表单,个人感觉,html方式虽然原始,但它是万能的解决方法。 生成页查询数据库,然后得到泛型,用stringbuilder 生成html代码。    1 ListModel.Quest...
  • HTTP协议与HTML表单(再谈GET与POST的区别)

    万次阅读 热门讨论 2009-12-05 07:48:00
    本作品采用知识共享署名-非商业性使用-相同方式共享 2.5 中国大陆许可协议进行许可。 HTTP的GET/POST方式有何区别?这是一个老生常谈的问题,但老生常谈的问题往往有一些让人误解的结论。本文将带您浅尝HTTP协议,在...
  • HTML表单及表单控件

    千次阅读 2018-09-21 11:36:12
    action 表示当确认时将表单提交到一个地址(可以使确认地址或者相对地址) method 提交表单时的请求类型 (get或者post类型) get方式的请求 一般默认为它,比较小一般不超过2k。(不在浏览器中不受限制) post...
  • HTML表单示例

    千次阅读 2019-01-11 23:57:56
    表单HTML页面中负责数据采集功能的部件。它往往由三部分组成,即表单标签、表单域、表单按钮。 表单标签:用于表面表单的范围,位于表单标签中的元素将被提交 语法:&lt;form&gt;&lt;form&gt; ...
  • 水平布局的HTML表单

    千次阅读 2018-02-23 22:00:54
    水平布局的表单对于非常简短的表单,用户要填写的内容比较少,CSS 表单本身也不会占用太多空间,比如网站顶端的快捷登录表单,它只包含用户名、密码和登录按钮:&lt;form action="" method="post...

空空如也

1 2 3 4 5 ... 20
收藏数 835,120
精华内容 334,048
关键字:

表单