HTML5中真的存在<input type="week">吗?


<input>标签指定了一个用户可输入数据的字段。<input>元素是最重要的表单元素。根据type属性的不同,<input>元素可以以多种不同的方式呈现。

由于其type属性值为"week",input元素表示一个星期输入字段。这些字段可以在支持的浏览器中通过允许用户以图形方式更新它的控件(例如日历)来表示,而不是要求用户将其值作为字符串输入。

让我们进入文章,进一步讨论HTML5中<input type="week">是否存在。

<input type="week">

带有type=week属性的<input>标签可以创建一个输入字段,用于输入星期和年份值。此区域内有一个日历图标。单击此图标会激活星期/年份选择器。每个浏览器都有独特的用户界面来控制。浏览器的支持参差不齐。也允许在星期字段中手动输入星期和年份格式。

语法

以下是HTML input type=week的语法

<input type="week">

让我们来看以下示例,以便更好地理解input type="week"。

示例

在下面的示例中,我们只是创建了一个带有星期控件的<form>。

<!DOCTYPE HTML>
<html>
   <body>
      <form action="#" target="_blank">
         <p>Choose Week:<input type="week" name="weekend">
         <input type="submit" value="SEND"></p>
      </form>
   </body>
</html>

输出

当脚本执行时,它将生成一个输出,其中包含一个输入字段,允许用户手动选择星期或使用提供的日历选择,因为输入字段被设置为type=week。

示例

考虑下面的示例,我们使用<datalist>元素提供建议值。

<!DOCTYPE HTML>
<html>
   <body>
      <form action="#" method="post" target="_blank">
         <p>Select Week For Vacation:<input type="week" name="week" list="weeklist">
         <input type="submit" value="SEND">
         </p>
      </form>
      <datalist id="weeklist">
         <option value="2016-W52">
            <option value="2016-W12">
               <option value="2017-W03">
                  <option value="2018-W05">
                     <option value="2018-W06">
      </datalist>
   </body>
</html>

输出

运行上述脚本后,它将生成一个输出,其中包含一个输入字段,允许用户选择星期,并使用<datalist>元素提供的脚本中的建议值。

示例

查看下面的示例,我们使用min和max属性来限制用户可以输入的值。

<!DOCTYPE HTML>
<html>
   <body>
      <form action="#" target="_blank">
         <p>Choose Week:<input type="week" name="selectedweek" min="2017-W04" max="2017-W15">
         <input type="submit" value="SEND">
         </p>
      </form>
   </body>
</html>

输出

当脚本执行时,它将生成一个输出,其中包含一个输入字段,允许用户选择一个特定星期(如使用min和max属性所指定),这些属性限制了输入。

更新于:2023年10月11日

276 次查看

启动你的职业生涯

通过完成课程获得认证

开始学习
广告
© . All rights reserved.