📜  HTML5-Web Forms 2.0

📅  最后修改于: 2020-10-23 06:13:30             🧑  作者: Mango


Web Forms 2.0是对HTML4中的表单功能的扩展。与HTML4相比,HTML5中的表单元素和属性提供了更高程度的语义标记,使我们摆脱了HTML4所需的繁琐脚本和样式。

HTML4中的元素

HTML4输入元素使用type属性指定数据类型。HTML4提供以下类型-

Sr.No. Type & Description
1

text

A free-form text field, nominally free of line breaks.

2

password

A free-form text field for sensitive information, nominally free of line breaks.

3

checkbox

A set of zero or more values from a predefined list.

4

radio

An enumerated value.

5

submit

A free form of button initiates form submission.

6

file

An arbitrary file with a MIME type and optionally a file name.

7

image

A coordinate, relative to a particular image’s size, with the extra semantic that it must be the last value selected and initiates form submission.

8

hidden

An arbitrary string that is not normally displayed to the user.

9

select

An enumerated value, much like the radio type.

10

textarea

A free-form text field, nominally with no line break restrictions.

11

button

A free form of button which can initiates any event related to button.

以下是使用标签,单选按钮和提交按钮的简单示例-

... 




Male
Female

...

HTML5中的元素

除了上述属性外,HTML5输入元素还为type属性引入了几个新值。这些在下面列出。

注意-使用最新版本的Opera浏览器尝试以下所有示例。

Sr.No. Type & Description
1 datetime

A date and time (year, month, day, hour, minute, second, fractions of a second) encoded according to ISO 8601 with the time zone set to UTC.

2 datetime-local

A date and time (year, month, day, hour, minute, second, fractions of a second) encoded according to ISO 8601, with no time zone information.

3 date

A date (year, month, day) encoded according to ISO 8601.

4 month

A date consisting of a year and a month encoded according to ISO 8601.

5 week

A date consisting of a year and a week number encoded according to ISO 8601.

6 time

A time (hour, minute, seconds, fractional seconds) encoded according to ISO 8601.

7 number

It accepts only numerical value. The step attribute specifies the precision, defaulting to 1.

8 range

The range type is used for input fields that should contain a value from a range of numbers.

9 email

It accepts only email value. This type is used for input fields that should contain an e-mail address. If you try to submit a simple text, it forces to enter only email address in email@example.com format.

10 url

It accepts only URL value. This type is used for input fields that should contain a URL address. If you try to submit a simple text, it forces to enter only URL address either in http://www.example.com format or in http://example.com format.

元素

HTML5引入了一个新元素,用于表示不同类型输出的结果,例如脚本编写的输出。

您可以使用for属性来指定输出元素与文档中影响计算的其他元素之间的关系(例如,作为输入或参数)。 for属性的值是其他元素的ID的空格分隔列表。


   
   
   

      
Enter a value :

它将产生以下结果-

占位符属性

HTML5引入了一个名为placeholder的新属性。