【问题标题】:Can you set the year/month of the HTML date input on initial dropdown?您可以在初始下拉列表中设置 HTML 日期输入的年/月吗?
【发布时间】:2020-03-02 01:15:22
【问题描述】:

我有一个日期字段,浏览器通过下拉当前月份的日期选择器来响应该字段。由于我必须有代码,所以你去:

<input type=date name=notimportant />

更重要的是,它的外观如下:

我要做的是更改它,以便月份和年份显示我想要的任何内容,而无需设置输入值。基本上,我想控制第一个/默认下拉日期信息。

这是因为我有一个可以在过去或未来使用的应用程序,并且不得不不断地向后或向前滚动几个月或几年到用户实际工作的日期/时间,这很烦人。

【问题讨论】:

  • 不,您必须设置该值。但顺便说一句,除非您 需要 查看其他可能存在冲突的到期日期,否则没有理由使用日期选择器,在 JS 中使用 type="number" 或 type="tel" + 格式会更好.
  • 我希望用户能够查看日历并进行导航,而不必手动输入日期。这要容易得多。
  • ...你错了吗?您实际上只是体验了自己,现在您正试图找到一种和平餐黑客(设置默认值)以使其更有用。不得不导航是一件令人头疼的事情。将其与您只需键入数字并自动插入斜线的文本字段进行比较。
  • 日期选择器的唯一原因是如果您想同时显示可能存在冲突的日期(以便用户可以围绕它们“选择”)。
  • @marblewraith,尽管您保证使用日期选择器只有一个可能的原因,但我的目标是让用户直观地浏览日期,而不仅仅是输入日期。也就是说,无论如何,您仍然可以在日期字段中手动输入日期,因此无论哪种方式都可以涵盖。您对解决所提出的问题有什么建议吗?

标签: html date


【解决方案1】:

鉴于您正在尝试做的事情,最简单的解决方案是为用户提供一种简单的方法来更改日期,甚至跨年。 jQuery datepicker 就是你的答案。它包含可以轻松逐月移动的控件:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Datepicker</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
  $( "#date" ).datepicker();
} );
</script>
</head>
<body>

<p>Date: <input type="text" id="date"></p>

</body>
</html>

【讨论】:

  • 听起来这可能是唯一的解决方案,因为内置 HTML 仅使用今天的日期作为“锚点”。
  • 是的。但它也可能是最好的,因为您的用户可以相对容易地前后移动几年。而且更容易维护。如果这解决了您的问题,请将其标记为答案。
猜你喜欢
  • 2019-10-13
  • 1970-01-01
  • 1970-01-01
  • 2012-06-08
  • 1970-01-01
  • 2021-01-11
  • 1970-01-01
  • 2020-08-15
  • 1970-01-01
相关资源
最近更新 更多