jQuery Datepicker - 关闭输入点击

Question

我使用jQuery Datepicker，我有一个小问题。

如果打开日期选择器，并再次单击输入字段，则不会发生任何事情。 我该如何改变..如果已经打开，输入点击时要关闭的选取器？

在此先感谢...

Answer 1

，因为它势必focus（默认），你可以绑定自己的.mousedown()处理程序，它不会干扰，这样的：

$("#datepicker").datepicker(); 
$("#datepicker").mousedown(function() { 
    $(this).datepicker("hide");  
}); 

You can give it a try here 。我正在使用mousedown，因为这就是它的近距离行为，所以只要符合更多的面向未来的这种行为。

Answer 2

因为我尚未对此发表评论......

一个讨厌的事情是，因为日期选择器使用重点，一旦你隐藏它，你不能再没有第一模糊，然后集中表现出来（所以点击某处否则，然后再次点击）。

我解决了这个通过添加下列尼克Craver的回答（鼠标按下内线）：

$(this).blur(); 

因此，它应该是这样的：

$("#datepicker").datepicker(); 
$("#datepicker").mousedown(function() { 
    $(this).datepicker("hide"); 
    $(this).blur(); 
}); 

Answer 3

我发现了一个更好的办法。隐藏似乎导致它不打开进一步的点击。模糊会导致日期选取器稍后打开。

我用拨动：

$('.datepicker').mousedown(function() { 
    $('#ui-datepicker-div').toggle(); 
}); 

Answer 4

为了工作更然后一次（尝试点击输入多次），你应该使用：

$("#datepicker").datepicker();  
$("#datepicker").mousedown(function() { 
    var cond = $(this).data('datepicker').dpDiv.is(':visible'); 
    $(this).datepicker(cond ? 'hide' : 'show'); 
}); 

Answer 5

这对我的作品（控制台。输出测试日志方法 - 删除生产）：

// call addToggleListener function one time to init 
addToggleListener($('.myDatepickerInputs')); 

// the function 
function addToggleListener(elm) 
{ 
    elm.off('mouseup'); 

    elm.on('mouseup', function() 
    { 
     $(this).off('mouseup'); 
     $(this).datepicker("show"); 

     console.log("show"); 

     $(this).on('mouseup', function() 
     { 
      $(this).off('mouseup'); 
      $(this).datepicker("hide"); 
      addToggleListener($(this)); 

      console.log("hide"); 
     }); 
    }); 
} 

使用日期选择器调用函数“onClo se“选项：

onClose: function() 
{ 
    addToggleListener($(this)); 
} 

使用Google Chrome进行测试。