自定义HTML和下拉列表 - jQuery UI Datepicker

时间:2014-01-09 03:09:22

标签: javascript jquery jquery-ui calendar datepicker

我想扩展jQuery UI Datepicker的样式和一些功能,但是在修改生成的html时遇到了问题。

具体来说,我正试图在一个双日历视图的顶部设置一个集中的年份和月份下拉列表。我希望默认的“下一步”和“后退”箭头放在集中式下拉列表的两侧。

这是我想要实现的目标的形象:

Centralised drop down selection with arrows

我需要这样做的原因是我的2个月视图日历在每个日期选择日历上都有月份标题:

full calendar showing calendar months with month names

我希望能够将箭头移动到中央月/年下拉列表的两侧,我无法弄清楚如何创建。根据我的理解,我认为我需要扩展jquery Ui Datepicker插件,但我不知道从哪里开始这样做。

任何帮助都将不胜感激。

1 个答案:

答案 0 :(得分:0)

就日历的样式而言,您必须覆盖特定css类的jquery.ui.css并使用相同的类名编写自己的CSS。

对于“月”和“年”按钮,您可以为此创建自己的控件,并在单击这些控件时启用jQuery datepicker。理想情况下,jQuery Datepicker只是一个可以从文本框或按钮启用的控件。所以你的源代码看起来并不重要。您需要做的就是从自定义控件/按钮启用datepicker。