jQuery UI datepicker：配置键盘快捷键
我使用jQuery UI datepicker让用户选择日期。 它有一些快捷方式，因此可以使用键盘控制：
page up/down - previous/next month ctrl+page up/down - previous/next year ctrl+home - current month or open when closed ctrl+left/right - previous/next day ctrl+up/down - previous/next week enter - accept the selected date ctrl+end - close and erase the date escape - close the datepicker without selection 但它对我来说似乎不是用户友好的。 在我在文档中阅读之前，我没有发现自己如何用键盘选择日期。 我想只有少数用户会发现他们必须按“CTRL +箭头键”来选择日期。
因此，我想用其他一些替换键盘快捷键。 特别是我希望用户在几天和几周之间使用箭头键导航时不必按“控制”键。
因为我在文档中没有找到关于此的任何配置， 所以我尝试使用一些自定义javascript实现此目标 ，在那里我监听键盘事件并手动设置日期。 但它从一个问题导致另一个问题：
- 它只在选择第一个日期后才能正常工作
- 当用户仅使用箭头键导航时，它会干扰用户使用“CTRL +箭头键”
- 输入字段中的日期会立即更新，与使用日期选择器的原始键盘控件的“CTRL +箭头键”导航时不同
- 由于
event.preventDefault()，浏览器的其他快捷方式无法正常工作
我知道所有这些问题都可以通过额外的Javascript再次解决，但如果我能以某种方式配置它，我会更喜欢它。
是否可以配置jQuery UI datepicker的快捷方式？
这不能通过datepicker进行配置。 您必须在此处更改_doKeyDown方法源 。
最简单的方法是扩展小部件。 它看起来像这样：
$.extend($.datepicker, { _doKeyDown: function(event){ //copy original source here with different //values and conditions in the switch statement } });
你可以查看这个附加组件： http ： //hanshillen.github.io/jqtest/#goto_datepicker
了解更多辅助function选项。
如果它是一个Jquery date picker那么默认情况下它将支持所有这些快捷方式。 可能存在一个问题，即Theme 。 您可以使用Jquery Site本身提供的CSS CDN 。 然后，甚至可以看到焦点。 这是一个很好的点击可访问性。
如果要替换其中一个快捷方式，并且不喜欢在更新jquery ui库时从存储库中复制代码，请使用：
var doKeyDown = $.datepicker._doKeyDown; $.extend($.datepicker, { _doKeyDown: function(event){ console.log(event.which); if(event.which !== $.ui.keyCode.ENTER) { doKeyDown(event); } else { //do something else } } });
在覆盖之前保留_doKeyDown的引用，并为所有其他快捷方式调用它。