如何通过双击关闭DateTimePicker

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

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

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

我知道有一个JavaScript DBLCLICK事件，但不知道如何在这种情况下应用它。

谢谢！

来源

2012-11-02 Max

我必须说，我真的很惊讶，网上有一个dblclick事件！（有趣的是，当你不在app开发一段时间时你错过了什么......）无论如何，你有什么方式向用户表明这是预期的行为？您如何提醒用户双击是您期望他们执行此功能的方式？如果您没有更好的方式让用户这样做，那么我会重新评估一下，而不是使用桌面上比网上更常见的事件类型。只是我的$ .02！ –

使用该解决方法：http://stackoverflow.com/a/16042436/1414562 –

尝试......

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


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

来源

2012-11-02 15:56:49

'。live（）'在jQuery 1.7中被弃用，你应该改变你的答案以使用'.on（）'或'.bind（）'。 – Barmar

大声笑不假设你知道人们使用的是什么版本，以Drupal为例，使用1.4： -/ –

你必须使用http://jqueryui.com/datepicker的datepicker。我的插件不包含该类： .ui-timepicker-div .ui-widget-header {margin-bottom：8px; } .ui-timepicker-div dl {text-align：left; } .ui-timepicker-div dl dt {height：25px; margin-bottom：-25px; } .ui-timepicker-div dl dd {margin：0 10px 10px 65px; } .ui-timepicker-div td {font-size：90％; } .ui-tpicker-grid-label {background：none; border：none;保证金：0;填充：0; } .ui-timepicker-rtl {direction：rtl; } .ui-timepicker-rtl dl {text-align：right; } .ui-timepicker-rtl dl dd {margin：0 65px 10px 10px; } – Max

您可以在HTML标签添加doubleclick事件处理程序。你会具有用于日期选择一个emtpy DIV，所以修改为

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

在close()函数编写代码隐藏datepicker股利。

来源

2012-11-02 16:33:20 mtk

以及DatePicker使用的输入文本框，我可以添加ondblckick事件，但我需要将双击附加到DatePicker本身。 – Max

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

我想出了一个解决方案，它不漂亮，但工作。您可以使用DateTimePicker的onSelect事件绑定几个处理程序如下：

（假设这._ $输入正在使用一个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事件中的相同逻辑来连接处理程序，因此单击当前选定的日期将始终关闭该选择器）。在你的情况下，如果你希望它能够严格按照双击工作，我可以推荐的是你跟踪点击之间的时间，并确保它们在某个阈值内到达。

来源

2013-01-22 05:32:37

如何通过双击关闭DateTimePicker

回答

相关问题