datepicker 相关问题

jQuery Datepicker：使用 Tab 键选择月份

我一直在尝试在 jQuery 日期选择器中的“下个月”按钮上启用 keydown 事件。 这个想法是让用户不使用鼠标而只使用制表键和 Enter 键来选择日期。 我知道...

React.jsx：类型无效，需要一个字符串（对于内置组件）或一个类/函数，但得到：object |反应本机用户界面日期选择器

我有一个使用react-native-ui-datepicker库中的DateTimePicker的组件。在使用 jest 为其编写测试用例时，它显示以下错误 警告：React.jsx：类型无效...

如何隐藏react-datepicker header？

我试图隐藏反应日期选择器中的标题。从我读到的内容来看，它应该只是标签 hideHeader。但它似乎对我不起作用。 据此，添加了该功能...

角度材质 - 叠加 X 日期选择器

我有一个关于 Angular Material 的叠加和日期选择器的问题。每当我在覆盖层外部单击时，我都会使用overlayOutsideClick 事件来关闭覆盖层。 它工作正常，但如果我

如果设置了默认值，为什么Fluent UI React的DatePicker中突出显示的日期没有改变？

参考Fluent UI React v9的DatePicker：https://react. Fluentui.dev/?path=/docs/compat-components-datepicker--default，value属性为默认值。但是当我设置它时，有些东西...

无法设置材质-ui 日期选择器确定/取消按钮的样式

我按照此链接中的步骤通过更改主题来更改背景颜色material-ui --> Date Picker 对话框。更改主题改变了背景颜色，但没有改变颜色...

Android：如何膨胀 XML 视图

我正在尝试按照 Google 提供的文档将 DatePicker 添加到我的 Android 应用程序中。我正在尝试做到这一点，以便在按下按钮时会出现选择器，从而允许用户...

DatePicker 可以只显示年份吗？

是否可以使用Apple自己的日期选择器并仅显示年份？ 这是我当前的代码： DatePicker("", 选择: $cameraViewModel.age, displayedComponents: .date) .

SwiftUI - 日期选择器仅显示年份

是否可以使用Apple自己的日期选择器并仅显示年份？ 这是我当前的代码： DatePicker("", 选择: $cameraViewModel.age, displayedComponents: .date) ...

Vuetify 日期选择器从 S M T W T F S => Sun Mon Tue Wed Thu Fri Sat 更改工作日标签

我的工作日标签有问题，我找不到将它们更改为这种格式的方法 （从 M 到 Mon 等...） 我的代码： 我对工作日标签有疑问，我找不到将它们更改为这种格式的方法 （从 M 到 Mon 等...） 我的代码： <v-date-picker :weekday-format="customWeekDays" v-model="selectedDate" show-adjacent-months ></v-date-picker> 和 const customWeekDays = computed(() => { return ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']; }); const selectedDate = ref<Date[] | undefined>(undefined); const selectedDateDisplay = computed(() => { if (selectedDate.value instanceof Date) { return format(selectedDate.value, 'dd MMM yyyy'); } return ''; }); 我已经尝试过这个：工作日格式（如何在 Vuetify 的日期/月份选择器中更改日期格式（M > Mo，F > Fr ...））道具，但它似乎对我不起作用 VDatePicker 使用日期适配器中的 getWeekdays() 来打印工作日标签（请参阅代码）。默认实现可以在here找到。 您可以将适配器更换为其他适配器，如 文档中所述。 这里是一个 playground 示例，其中覆盖了 getWeekdays()（检查 vuetify.js 选项卡 - 我正在使用 @date-fns/luxon 适配器，因为它很容易进入 Playground，您可以轻松覆盖默认适配器或在您的项目中选择一个不同的）。 可能不像您希望的那么简单，但就是这样。希望有帮助。

日期选择器的Onshow事件

我想在显示时向日期选择器添加类。我写了这段代码但不起作用。 这个怎么做？ $(targetEl).datepicker({ 日期格式：“年/月/日”， 更改月份：正确， 更改年份：t...

如何在此日期选择器中只允许选择几个日期？

我正在使用这个撰写库作为我的日期选择器：https://github.com/maxkeppeler/sheets-compose-dialogs 该可组合项仅接受不允许的日期，如下所示： val 禁用日期 = listOf( 洛克...

如何在此 Android 撰写日期选择器中只允许选择几个日期？

我正在使用此撰写库作为日期选择器：（https://github.com/maxkeppeler/sheets-compose-dialogs）。 图书馆仅接受以下不允许的日期： 禁用日期 = 列表（ LocalDate.n...

vanillajs-datepicker 不设置输入值，点击日期时不会触发更改事件

美好的一天 我正在使用这个日期选择器，我喜欢它，但在我单击日期后它不会触发输入上的更改事件。 这是我的代码 我在 jsFiddle 上测试了这个 美好的一天 我正在使用这个日期选择器，我喜欢它，但在我单击日期后它不会触发输入上的更改事件。 这是我的代码 我在 jsFiddle 上测试了这个 <input type="text" name="foo"> const elem = document.querySelector('input[name="foo"]'); const datepicker = new Datepicker(elem, { autohide: true, todayHighlight: true, format: "yyyy-mm-dd", }); elem.addEventListener("change", function (e) { console.log(e.target.value); }); 当我单击日期选择器上的特定日期时，不会触发更改事件。 我需要这方面的帮助。 我还将它与 livewire 和 alpine 一起使用，但单击日期后，甚至没有触发更改。这是我的 Laravel 代码 当我测试 pickaday 时它有效。 我如何解决这个问题或使其即使在 vanillajs datepicker 上也能触发更改。 提前致谢。 您的库不会触发像onchange这样的本机事件，这就是它不起作用的原因。您必须使用库自定义事件来代替 文档中的信息 更改日期 const elem = document.querySelector('input[name="foo"]'); const datepicker = new Datepicker(elem, { autohide: true, todayHighlight: true, format: "yyyy-mm-dd", }); elem.addEventListener("changeDate", function (e) { console.log(e.target.value); }); <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/datepicker.min.css"> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/datepicker-full.min.js"></script> <input type="text" name="foo">

自定义日期选择器：如何更改图标图像并单击代码隐藏上的文本框打开弹出窗口？

这是我的自定义日期选择器： 这是我的自定义日期选择器： <customcontrols:CustomDatePicker x:Name="DataCreazione" SelectedDate="{Binding DataCreazione, StringFormat={}{0:dd/MM/yyyy}}" controls:TextBoxHelper.Watermark="Data Creazione" Cursor="Hand" BorderThickness="0" SelectedDateFormat="Short" Margin="0,0,0,0" Grid.ColumnSpan="3" Grid.Row="1" /> 我将此模板应用于后面的代码： using System.Windows; using System.Windows.Controls; using System.Windows.Input; namespace Client.customcontrols { public class CustomDatePicker : DatePicker { public override void OnApplyTemplate() { base.OnApplyTemplate(); if (Template.FindName("PART_TextBox", this) is TextBox textbox) { textbox.IsReadOnly = true; textbox.Cursor = Cursors.Hand; textbox.PreviewMouseLeftButtonDown += PreviewMouseLeftButtonDown_Click; } if (Template.FindName("PART_Button", this) is Button button) { button.Visibility = Visibility.Hidden; } } private void PreviewMouseLeftButtonDown_Click(object sender, System.Windows.Input.MouseButtonEventArgs e) { IsDropDownOpen = true; } } } 我愿意： 而不是隐藏图标，我想更改它的图像（使用PackIconFontAwesome的CalendarAltSolid），大小16x16，边距0,0,8,0 单击文本框后，单击图标具有相同的行为（弹出窗口打开，在我选择日期之前保持打开状态）；相反，使用 PreviewMouseLeftButtonDown，它似乎会保持弹出窗口打开，直到我按下鼠标左键单击，一旦其“向上”，弹出窗口就会消失 你能帮我解决这个问题吗？ 您始终可以为Button定义自定义模板，例如： <customcontrols:CustomDatePicker x:Name="DataCreazione" SelectedDate="{Binding DataCreazione, StringFormat={}{0:dd/MM/yyyy}}" controls:TextBoxHelper.Watermark="Data Creazione" Cursor="Hand" BorderThickness="0" SelectedDateFormat="Short" Margin="0,0,0,0" Grid.ColumnSpan="3" Grid.Row="1" > <customcontrols:CustomDatePicker.Resources> <ControlTemplate x:Key="ButtonTemplate" TargetType="Button"> <Grid Background="Silver"> <iconPacks:PackIconControl Kind="{x:Static iconPacks:PackIconFontAwesomeKind.CalendarAltSolid}" Width="24" Height="24" /> </Grid> </ControlTemplate> </customcontrols:CustomDatePicker.Resources> </customcontrols:CustomDatePicker> if (Template.FindName("PART_Button", this) is Button button) { button.Template = FindResource("ButtonTemplate") as ControlTemplate; }

Mat 日期范围日期选择器显示错误的值 - Angular

Mat 日期范围日期选择器显示错误的值 我需要起始值 2021-02-01T00:00:00.000Z

使用 vue js 2 的日期选择器滚动器

我想创建一个像这张照片一样的日期选择器（使用 vue js 2），这样我就可以 在移动视图中使用它。 在此输入图像描述 谁能帮我 ？ 我试图找到任何包裹，但它有...

如何使用@react-testing-library测试@mui/x-date-pickers

我尝试使用 DatePicker 组件为我的表单编写一个测试。我在最新版本 6.2.0 中使用@mui/x-date-pickers。 当我运行下面的测试时，我收到消息： “测试库元素呃...

在 Rails 中选择带有日期的卡片后更改课程显示

我正在为马术学校开发一个应用程序，以便他们可以组织他们的课程并查看谁预订了课程等等！ 在所有类别的显示中，我创建了帮助用户选择...

点击时 Flowbite 日期选择器不显示

我有一个输入字段，它是一个 Flowbite 日期选择器字段。 然而，当点击时，什么也没有发生...... 我还需要导入js文件吗？ 这是我所拥有的： 导入日期...</desc> <question vote="0"> <p>我有一个输入字段，它是一个 flowbite 日期选择器字段。 然而，当点击时，什么也没有发生...... 我还需要导入js文件吗？</p> <p>这是我所拥有的：</p> <pre><code>&lt;script setup&gt; import Datepicker from &#39;flowbite-datepicker/Datepicker&#39;; document.addEventListener(&#34;DOMContentLoaded&#34;, function () { document.querySelectorAll(&#34;[datepicker]&#34;).forEach(function (datepickerEl) { const d = new Datepicker(datepickerEl); d.setOptions(datepickerOptions); }); }); &lt;/script&gt; </code></pre> <p>在 vue 文件部分：</p> <pre><code>&lt;div class=&#34;relative max-w-sm&#34;&gt; &lt;div class=&#34;absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none&#34;&gt; &lt;svg class=&#34;w-4 h-4 text-gray-500 dark:text-gray-400&#34; aria-hidden=&#34;true&#34; xmlns=&#34;http://www.w3.org/2000/svg&#34; fill=&#34;currentColor&#34; viewBox=&#34;0 0 20 20&#34;&gt; &lt;path d=&#34;M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z&#34; /&gt; &lt;/svg&gt; &lt;/div&gt; &lt;input datepicker datepicker-autohide type=&#34;text&#34; class=&#34;bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500&#34; placeholder=&#34;Select date&#34; id=&#34;datepickerEL&#34;&gt; &lt;/div&gt; </code></pre> <p>因此输入字段显示正确。但正如所说，什么也没有发生。我可能错过了这里的一部分代码......</p> </question> <answer tick="false" vote="0"> <p>还没有解决方案，但是，我又向前迈进了一步。</p> <p>问题似乎是模态......</p> <p>当我在“普通”vue 视图中使用日期选择器时，它可以工作。但是，当模态中具有相同的代码时，下拉菜单不起作用。</p> </answer> </body></html>