PHP笔记(二) HTML表单

大多数PHP程序都使用HTML表单从用户那里获取数据并计算结果。

  • 选择适合于收集的数据类型和提供交互方式的控件。
  • 清楚标记每一个控件,这样用户就可以理解其功能。
  • 尽可能将标签对齐。将控件的左边缘对齐。
  • 将相关的标签分组,并且通过设计中使用空白将每一个分组分开。
  • 表单上的控件顺序应该类似于用户操作他们的顺序。

首先创造一个基本的HTML大纲,包含表单控件;然后将控件进行合并(HTML表单必须包括一个提交按钮,用户单击它可以将表单数据发送到服务器。)一个单独的HTML页面可以包含多个表单。

  • 创建HTML结构

包含表单的HTML结构和和普通的HTML结构一样。

在包含表单的HTML页面中可以使用任何HTML标签。基本的表单使用FROM标签来说明。该标签中METHOD属性接收GET或POST两个值中的一个。ACTION属性子明PHP脚本的url,该脚本可以收集通过表单收集的数据,可以是绝对路径或者相对路径

  • 合并控件

两个常用的基本控件:文本框和提交按钮。

文本框:允许用户键入信息以发送给PHP脚本。NAME属性为文本提供名称,PHP脚本可以通过名称准确访问其内容,因此它应该是唯一的且符合PHP变量命名规则(但不需要$符号),单标签。VALUE属性指明出现在提交按钮上面的标题。创建方式如下:

提交按钮:允许用户将一个表单的内容发送到服务器,一个HTML表单对应应该有一个提交按钮。

示例:一个完整的HTML表单。

  • 使用多个表单

可以在一个HTML页面中包含多个表单,注意下一个表单的FORM开始之前需要结束前一个FORM表单。

  • 创建自定义的文本框

文本框的属性中,TYPE和NAME是必须的,其余是可选属性。SIZE属性用于设置文本框的可视大小;MAXLENGTH指明用户键入字符的最大长度;VALUE给出了一个最初显示在文本框中的值。

  • 创建文本区域

文本区域可以输入多行文本。NAME和ROWS属性是必须的。ROWS属性表明了文本区域内可以看到的文本行数,充满时会滚动。COLS属性指明可见文本列数与行数类似。WRAP属性指明文本区域内单词换行的方式,可以指定如下值。该标签为双标签。

  • 创建密码框

创建密码框的语法与文本框相同,但要将TYPE属性指定为PASSWORD而不是TYPE。

  • 创建复选框

取两个值中的一个,即二选一。TYPE属性是必须的,checked属性出现,该复选框默认情况会被选定。value属性指定复选框被选定情况下被发送到服务器的值,默认发送on值。法如下:

  • 创建单选按钮

语法与复选框属性含义相同,但是TYPE属性的值必须是RADIO,NAME属性是必须的。

  • 创建列表框

用户可以选择一个或者多个选项,它是一个滚动菜单。

name属性是必须的,multipile属性指明用户可以通过按下crtl键并单击多个选项来选择它们

列表框的单选行为可作为单选按钮。

  • 创建隐藏域
  • 实现上传文件的HTML表单

其中type属性是必须的。格式通过使用MIME码指定。常用的格式如下:

超文本标记语言文本 .html,.html text/html

  普通文本 :txt text/plain

  word文档:application/msword

  RTF文本 :rtf application/rtf

  GIF图形 :gif image/gif

  JPEG图形 :jpeg,

  jpg: image/jpeg

  au声音文件:au audio/basic

  MIDI音乐文件 :mid,.midi audio/midi,audio/x-midi

  RealAudio音乐文件 .ra, .ram audio/x-pn-realaudio

  MPEG文件 .mpg,.mpeg video/mpeg

  AVI文件 .avi video/x-msvideo

  GZIP文件 .gz application/x-gzip

  压缩文件.rar application/octet-stream

  压缩文件.zip application/x-zip-compressed

  TA件 .tar application/x-tar

  • 使用图像提交数据
  • 创建重置按钮

HTML表格,列表,表单(笔记10)

网络安全自学笔记10

继续学习HTML,学习资料解压到了E盘根目录

浏览器打开E:/html教学资料/html教学版/index.htm,可以全部展开学习

HTML在线手册

表格是用<table>标签定义的。表格被划分为行(使用<tr>标签),每行又被划分为数据单元格(使用<td>标签)。td表示“表格数据”(Table Data),即数据单元格的内容。数据单元格可以包含文本,图像,列表,段落,表单,水平线,表格等等

1、如何在HTML页面中创建表格

表格

2、想要显示一个有边框的表格,需要使用border属性

表格边框

3、如果不指定border属性,表格将不显示边框

没有边框的表格

4、表格头使用<th>标签指定

表格头

5、表格中的空单元格(在多数浏览器中,没有内容的单元格显示得不太好)

空单元格

6、可以在空单元格里加入不可分空格来占位,这样边框能正常显示

不可分空格

7、如何创建一个有标题的表格

有标题的表格

8、如何定义跨行或者跨列的单元格

单元格跨行(列)的表格

9、如何在元素中显示其他元素

10、如何使用cellpadding属性在表格内容和边框之间留出更多空白

cellpadding属性

11、如何使用cellspacing属性来增加单元格间距

cellspacing

12、给表格增加背景色或者背景图像

表格增加背景

单元格增加背景

13、如何使用“align”属性来设置单元格的对齐方式,让表格好看一些

给单元格内容设置对齐方式

14、如何使用“frame”属性来控制表格周围的边框

HTML支持有序、无序和自定义列表

1、无序列表是一个项目的序列。各项目前加有标记(通常是黑色的实心小圆圈),以<ul>标签开始,每个列表项目以<li>开始

无序列表

无序列表的不同类型

2、有序列表也是一个项目的序列。各项目前加有数字作标记,以<ol>标签开始,每个列表项目以<li>开始

有序列表

有序列表的不同类型

3、自定义列表不是一个项目的序列,它是一系列条目和它们的解释,以<dl>标签开始,自定义列表条目以<dt>开始,自定义列表的定义以<dd>开始

自定义列表

4、怎样嵌套列表

表单是一个能够包含表单元素的区域。表单元素是能够让用户在表单中输入信息的元素(比如文本框,密码框,下拉菜单,单选框,复选框等等),表单是用<form>元素定义的

1、如何创建文本框

文本框

2、如何创建密码框

密码框

3、如何创建单选按钮

单选按钮

4、创建复选框

复选框

5、表单的action属性和提交按钮。当用户点击提交按钮的时候,表单的内容会被提交到其他文件。表单的action属性定义了所要提交到的目的文件,该目的文件收到信息后通常进行相关的处理

含有文本框和提交按钮的表单

6、如何从一个表单发送电子邮件

从表单发送电子邮件

总结:

1、继续了解HTML语言

2、学习HTML表格,列表,表单

前端入门——html 表单

前面已经学习相关html大部分知识,基本上可以制作出简单的页面,但是这些页面都是静态的,一个网站如果要实现用户的互动交流,这时表单就起到关键的作用,表单的用途很多,它主要用来收集用户的相关信息,是网页具有交互的功能。例如,用户注册登录,留言等。

下面会详细介绍表单的使用方法,有以下内容:

  • 表单标签form的使用
  • 表单控件使用

使用<form></form>标签来创建一个表单,在其之间就是各种表单控件,如,输入框,文本框,单选按钮,多选按钮,提交按钮等。

语法代码如下:

1、action —— 处理程序

这里的 action 属性值表单提交的地址,就是表单收集好数据后要传递给远程服务的地址,其地址可以是绝对路径也可以是相对路径,或者其它形式,如发送电子邮件。

使用表单发送电子邮件:

提交到后台程序地址:

2、name —— 表单名称

表单名称,这一属性不是必需的,但是为了防止表单信息提交到后台处理程序时发生混乱,一般要设置一个名称,且在同一页面中最好是唯一的,不要和其它表单重复命名。

3、method —— 传送数据方法

method 属性用来定义处理程序使用那种方法来获取数据信息,常用的有 get 和 post (http 协议定义的方法)。

何时使用 GET?

GET 最适合少量数据或不是很重要数据的提交,浏览器会设定容量限制,默认如何没有设置method 属性,表单则会使用get 方法。

当您使用 GET 时,表单数据在页面地址栏中是可见的,会在表单提交的地址后面跟一个问号“?” ,问号后面是数据,以 名称1=值1&名称2=值2 形式发送到后台程序。

地址栏会看到如下:

关于 GET 的注意事项:

以名称/值对的形式将表单数据追加到 URL

永远不要使用 GET 发送敏感数据!(提交的表单数据在 URL 中可见!)

URL 的长度受到限制(2048 个字符)

对于用户希望将结果添加为书签的表单提交很有用

GET 适用于非安全数据,例如 Google 中的查询字符串

何时使用 POST?

使用post 表单数据和url(表单提交地址)是分开发送的,在页面地址栏中被提交的数据是不可见的,这样安全性更好,用户端会通知服务端获取数据,所以这种情况没有数据长度的限制,缺点是速度会慢些。

关于 POST 的注意事项:

将表单数据附加在 HTTP 请求的正文中(不在 URL 中显示提交的表单数据)

POST 没有大小限制,可用于发送大量数据。

带有 POST 的表单提交后无法添加书签

4、enctype —— 编码方式

enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。

有以下几种值:

5、target —— 目标显示方式

target 属性规定在何处打开 action URL。表单的目标窗口通常用来显示表单返回的信息,例如是否成功提交了表单,是否出错等。

属性值有以下:

看到这里是不是想的了之前学习超链接时候,a标签也有同样的属性,这里差不多一个意思,只是用途不一样。

这里的窗口有可能是框架 frame 或 浮动窗口 iframe ,后面会讲到框架和浮动窗口,就是在一个页面中可以嵌套一个子窗口。

什么是表单控件,就是收集数据的各种形式控件,比如输入框,密码框,单选、多选按钮,下拉菜单,文本域,文件域,提交按钮等等。

如下代码:

效果如下:

这里显示了一个基本表单,包含了输入框,密码框,单选,下拉菜单,文本域等组件,下面会按其使用类型介绍表单控件。

所有表单控件都一个name属性和vaule属性,用于和其它控件区别,后台程序将会以此名称获取其表单控件对应的vaule值。

下篇会介绍各种表单控件的使用,感谢关注。

上篇:

下篇:

本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com

点赞 0
收藏 0

文章为作者独立观点不代本网立场,未经允许不得转载。