时间戳

首页 > 解决方案 > jquery 日期时间选择器控件弹出窗口

jquery - jquery 日期时间选择器控件弹出窗口

问题描述

我正在使用来自http://xdsoft.net/jqplugins/datetimepicker/的 jQuery DateTimePicker 插件。我不想在关注文本框时打开日历弹出窗口，而不是我想在文本框末尾提供一些图像按钮，当用户单击图像按钮时，只有日历弹出窗口应该打开以进行日期时间选择。当专注于文本框用户应该能够手动输入。如果弹出窗口出现，有时弹出窗口会出现在文本框上方，因此我们在文本框中看不到任何手动输入的内容。示例代码如下：

     $('#StartDate').datetimepicker({
            value: defaultStartDateTime,
            step: 15,
            closeOnDateSelect: true,
            format: 'm/d/Y H:i',
            mask: true }); 
     $('#StartDate').focus(function () {             
            $('#clientLogsStartDate').datetimepicker('hide');                           
     });

标签： jquerydatetimepicker

解决方案

尝试关闭datetimepicker事件

open.xdsoft focusin.xdsoft mousedown.xdsoft touchstart


$('#StartDate').datetimepicker({
  value: new Date(),
  step: 15,
  closeOnDateSelect: true,
  format: 'm/d/Y H:i',
  mask: true
}).off('open.xdsoft focusin.xdsoft mousedown.xdsoft touchstart')

$('button').on('click', function() {
  $('#StartDate').datetimepicker('show')
});
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.min.css" integrity="sha256-DOS9W6NR+NFe1fUhEE0PGKY/fubbUCnOfTje2JMDw3Y=" crossorigin="anonymous" />

<input id="StartDate" type="text">
<button>Show</button>

推荐阅读