Question

我使用的是jQuery DateTimePicker插件（按：Trent Richardson），它只会在您选择日期和时间后关闭。但是，有些用户并不关心时间，他们希望日历只在选择日期后关闭。

我设法在选择日期后关闭日历，但我需要实现双击而不是单击。我怎么做？这是我的代码：

$(jqCompletedEndID).datetimepicker({  
    ampm: true, 
    onSelect: function(){
       $(this).datepicker("hide"); $(this).blur();
    }
});

我知道Javascript中有一个dblclick事件，但不确定如何在此上下文中应用它。

谢谢！

Answer 1

我遇到了完全相同的问题/要求。我尝试了与Alex的解决方案非常相似的东西，但它不起作用，因为datetimepicker似乎在选择一天时擦除所有样式和事件绑定（我假设它正在重建，但没有检查），使得它不可能dblclick要触发的事件。

我想出了一个不漂亮但确实有效的解决方案。您可以使用datetimepicker的onSelect事件来绑定几个处理程序，如下所示：

（假设这个._ $ input是对正在使用的输入控件的jQuery引用）

this._$input.datetimepicker({
...
onSelect: function() {
    var self = this;
    setTimeout(
            function () {
                $('.ui-datepicker-current-day').bind('click', function () { self._$input.datepicker('hide'); });
                $('.ui-datepicker-current-day').bind('dblclick', function () { self._$input.datepicker('hide'); });
            },
            0
        );
}

你可能想知道为什么我绑定点击和双击，特别是考虑到我上面的说法双击不起作用。似乎在Chrome，FireFox，Safari和Opera中，事件将触发“点击”事件，但在IE中它将触发“dblclick”事件。另外，如果您对setTimeout感到疑惑，那么它是必需的，因为在方法完成之后才会构建弹出窗口，因此如果没有它，那些选择器将不会返回任何内容。

毫无疑问，当点击当前选择的日期时，我的解决方案也将关闭选择器，无论它是否是双击的一部分。这在我的情况下是故意的（并且我还在beforeShow事件中触发相同的逻辑来连接处理程序，因此单击当前选择的日期将始终关闭选择器）。在您的情况下，如果您希望它严格地通过双击工作，我可以建议您跟踪点击之间的时间并确保它们达到某个阈值。

Answer 2

试试这个......

$('#datepicker').datepicker({
     //...
});


$('table.ui-datepicker-calendar a').bind('dblclick', function() {
   $('#datepicker').val();
});

Answer 3

您可以在html标记本身上添加doubleclick事件处理程序。你将有一个针对datepicker的emtpy div，所以将其修改为

<div id="datepicker" ondblclick="close()"></div>

在close()函数中编写代码以隐藏datepicker div。

如何双击关闭DateTimePicker

3 个答案: