Question

滚动时如何防止日历小部件浮动在屏幕上？我正在使用Jquery datepicker。

Answer 1

var datePicker = $('#datepicker').datepicker();

$(".demo").scroll(function() {
  datePicker.datepicker('hide');
  $('#datepicker').blur();
});

$(window).resize(function() {
  datePicker.datepicker('hide');
  $('#datepicker').blur();
});

当滚动容器div或窗口时，这将隐藏日期选择器。这是一个工作小提琴check solution

$('#datepicker').blur();会派上用场，当用户滚动.demo日历隐藏但输入仍然是焦点时，所以当他向后滚动时他可能会感到困惑。因此，当我模糊它时，他将不得不再次点击输入并显示日期选择器。

Answer 2

我尝试了我能在网上找到的每个答案。我最终只是这样做是为了在滚动时隐藏日期选择器：

$(document).ready(function() {
  var datepickerWin = $("id$=txtboxDate").datepicker({});
  
  document.addEventListener("wheel", function(event){ //anytime the mousewheel is scrolled
    datepickerWin.datepicker("hide");
    $("id$=txtboxDate").blur(); //so we can remove the mouse cursor from the input field
  });
  
  $("id=btnDate").click(function() {
    datepickerWin.datepicker("show");
  });
  
  
  
});

如何在滚动时防止日历小部件浮动？

2 个答案: