3

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

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

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

我知道 Javascript 中有一个 dblclick 事件，但不确定如何在这种情况下应用它。

谢谢！

4

3 回答 3

1

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

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

（假设 this._$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 中该事件会触发“click”事件，但在 IE 中它会触发“dblclick”事件。此外，如果您想知道 setTimeout，它是必需的，因为在方法完成之前不会构造弹出窗口，因此如果没有它执行这些选择器将不会返回任何内容。

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

于 2013-01-22T05:32:37.463 回答
0

您可以doubleclick在 html 标记本身上添加事件处理程序。您将为 datepicker 提供一个 emtpy div，因此将其修改为

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

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

于 2012-11-02T16:33:20.540 回答
0

尝试这个...

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


$('table.ui-datepicker-calendar a').bind('dblclick', function() {
   $('#datepicker').val();
});
于 2012-11-02T15:56:49.460 回答