问题标签 [html5-input-date]

我使用 react-bootstrap <Form.Control type="date"> 并且日历图标或日期选择器自动设置到表单字段的右侧/末尾。我想将日历图标/日期选择器移动到表单字段的左侧/开头，或者它立即跟随日期。我试图找到合适的 node_module 来更改日历图标位置的 CSS 代码，但我找不到它。

那么有谁知道我应该在哪里改变 CSS 或者有更好的解决方法吗？

这是表单现在的样子：

我知道这个问题存在，但我找不到正确的解决方案，而且其他人的问题似乎与我的不同。我已经检查过了：你如何以编程方式清除 HTML5 日期字段？. 在我的情况下，表单由现有值预先填充，我希望用户通过表单更新将数据库中的日期更改为空。这是我尝试过的：

在第一种情况下，我在输入中得到 jj/mm/aaaa，但在 dom 中，我总是有这个输入的现有值

在第二种情况下，我得到 jj/mm/aaaa 并且属性值不再存在，但是服务器正在获取现有值，就像属性存在但只是隐藏一样。

如何处理？谢谢

在某些情况下，我只想重置日期输入库中的年份。

请参阅下面的示例，如果用户键入日期大于，我想重置年份2022-12-31。

当我尝试它重置整个日期但我只想重置年份而不是完整日期。

示例：如果用户类型01/01/2023，则应将其重置为01/01/yyyy.

我有一个input[type="date"]最小/最大范围。我想要实现的是隐藏从 dd/mm/yyyy 开始以任何语言显示的占位符文本。到目前为止所尝试的是添加以下 CSS。

但这不会产生预期的输出，因为我在元素上有一个范围验证器。

请提前告知和感谢。

我正在尝试在 angularjs 中自动聚焦日期字段。我已经为它编写了一个指令，它工作正常，但我遇到了一个问题。HTML5 日期选择器不会打开，除非我不点击右侧出现的图标。

有人可以帮我弄清楚如何在自动对焦上打开日期选择器，以及当我们单击输入字段上的任意位置时如何打开日期选择器。

谢谢

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

对于本机浏览器日期选择器，当单击右侧的图标时，将打开日历弹出窗口。您知道是否有办法检测日历弹出窗口刚刚关闭并且用户从中选择了一个值？

目前本机日期选择器存在问题：当用户单击日历上的箭头图标时，它会自动填充输入框，并且输入有 formcontrol，其中有 changeDetector 会监视更改然后触发 api 调用。

如果有办法检测日历弹出窗口是否已关闭，那么我可以删除 changeDetector 并仅在日历弹出窗口关闭后才调用 api 调用。这将降低成本。

但是我不知道如何检测刚刚关闭的日历。如果在日期选择器打开和关闭时我可以得到不同的类名，那么我可以检测到它。但是从开发者控制台来看，类名看起来是一样的。

我需要为我的 React 应用程序使用日历，用户可以在其中选择多天。

到目前为止，我只找到了 react-date-picker 模块，但我不太喜欢它的 CSS 自定义。

我认为如果有这样的机会，最好使用 HTML 标记 input type="date"，因为它在所有移动设备上看起来都不错（我的应用程序仅适用于移动设备）。

在桌面上，此元素的行为与智能手机不同，每次用户选择日期时它都会关闭，但我不需要桌面，而在智能手机上，日历在单击后不会关闭，这很棒，但是，我想设置样式以某种方式在背景中选择日期，以便用户可以看到他选择的内容。

我想出了如何将所有这些日期添加到一个数组中，它在智能手机上基本上可以正常工作，但问题是我无法为打开的日历设置样式。

有人可以建议我如何设计用户点击的日子吗？因为默认情况下它会显示您选择的最后一个日期的背景，仅此而已。

这是我的代码框链接

我有一个日期输入元素。

下面的红色方块是可以点击按钮打开日期选择器的默认区域：

我想知道是否可以增加这个区域以使其更容易点击，像这样更宽：

html、javascript 或 css 中的解决方案都可以。

我有这个日期Input： 我正在尝试显示默认值：

但是，正如您在上面看到的，它不会显示。
我遵循了Mozilla 文档：

您可以在 value 属性中使用日期为输入设置默认值，如下所示：