数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会研究
服装研究
法律研究如何在HTML中使用时间输入类型？
Html 提供各种标签来设计用户界面。有一类标签可以方便地为用户提供选择日期和时间类型数据。
要使用HTML创建时间控件，我们有<input type=”time”>标签，其中时间值可以在<input>标签的TYPE属性中使用。
默认情况下，时间控件将以24小时制显示输出。时间可以用hh:mm（小时：分钟）格式表示，如果要包含秒，则格式为hh:mm:ss。小时值可以在0-24之间选择，分钟值在0-59之间。
让我们来看一个创建时间类型输入元素的程序。
示例
<html> <body> <form> <label for="meet">Meeting Time :</label> <input type="time" id="time1"> </form> </body> </html>
当选择时钟图标时，它将打开计时器选项，从中可以选择时间。
我们还可以设置时间选择器的默认值，在这种情况下，它最初将显示默认时间而不是空白。要设置默认值，可以使用VALUE属性。
示例
<html> <body> <form> <label for="meet">Meeting Time :</label> <input type="time" id="time1" value="13:20"> </form> </body> </html>
我们还可以为时间选择器控件指定范围，因为在某些情况下可能需要限制时间输入，例如工作时间限制、商店营业时间等。对于此类信息，应使用min、max和step属性设置范围，如果用户选择超出给定范围的值，将显示错误消息。
示例
<html> <body> <form> <table border="3" bordercolor="black"> <caption>Online Doctor Appointment Form</caption> <tr> <td>Doctor Name</td> <td>Speciality</td> <td>Appointment Date</td> <td>Available Time</td> </tr> <tr> <td>Dr Kapoor</td> <td>Orthopedic Surgeon</td> <td><input type="datetime-local"></td> <td> <input type="time" id="time1" value="09:12" min="09:00" max="12:00"> </td> <td><input type="submit" value="Schedule"></td> </tr> </table> </form> </body> </html>
在这个程序中，我们还使用了datetime-local控件来指定“预约日期”。并使用时间控件创建一个时间选择器。可用时间使用VALUE属性（9:30 – 12:00）显示在字段中，如果用户选择的是其他时间，
则会生成错误。
例如，如果要强制用户从时间选择器中选择值，则可以使用REQUIRED属性。
除了设置时间范围外，我们还可以向下拉列表中添加一些特定值。现在让我们考虑一个类似于flightview.com的航班追踪应用程序示例。在这个应用程序中，我们可以通过输入航班详细信息或路线信息来追踪航班。此外，还可以指定航班时间，用户可以选择可用时间。
为此，我们可以在HTML表单中使用<datalist>标签。这可以通过在<input>标签中使用list属性将其链接到<input>标签。
示例
<html> <body> <form name="form1"> <label for="fli">Flight Timings :</label> <input type="time" list="avail"> <datalist id="avail"> <option value="06:00"> <option value="07:00"> <option value="08:00"> </datalist> <br><br> <input type="submit" value="Book"> </form> </body> </html>
22K+ 次浏览
