日期范围选择器在关闭时会丢失范围

时间:2022-08-08 20:11:36

I am struggling with an issue. I want to close the date range picker when a user starts scrolling down the page. I am using this plugin to create the date range picker:

我正在努力解决一个问题。我想在用户开始向下滚动页面时关闭日期范围选择器。我正在使用此插件来创建日期范围选择器:

http://www.daterangepicker.com/

$(function() {
$('input[name="daterange"]').daterangepicker({
    timePicker: true,
    timePickerIncrement: 30,
    locale: {
        format: 'MM/DD/YYYY h:mm A'
    },
    ranges: {
       'Today': [moment(), moment()],
       'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
       'Last 7 Days': [moment().subtract(6, 'days'), moment()],
       'Last 30 Days': [moment().subtract(29, 'days'), moment()],
       'This Month': [moment().startOf('month'), moment().endOf('month')],
       'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
    }
});

$(window).scroll(function() {
    if ($('input[name="daterange"]').length) {
        $('input[name="daterange"]').daterangepicker("close");
  }
});

});

I've created a fiddle to show the issue:

我创造了一个小提琴来展示这个问题:

https://jsfiddle.net/ccgorman/rLnycn80/

I have a bit of JS that closes the date range picker when the user scrolls, but as you can see, when you scroll back up and open it up again all the buttons, like Today, Yesterday...are gone, any idea how I close the picker without losing these buttons?

我有一些JS在用户滚动时关闭日期范围选择器,但正如你所看到的,当你向上滚动并再次打开它时,所有的按钮,如今天,昨天......都消失了,任何想法如何我关闭了选择器而没有丢失这些按钮?

1 个解决方案

#1


0  

Change this line: $('input[name="daterange"]').daterangepicker("close"); with: $('input[name="daterange"]').data('daterangepicker').hide();

更改此行:$('input [name =“daterange”]')。daterangepicker(“close”); with:$('input [name =“daterange”]')。data('daterangepicker')。hide();

#1


0  

Change this line: $('input[name="daterange"]').daterangepicker("close"); with: $('input[name="daterange"]').data('daterangepicker').hide();

更改此行:$('input [name =“daterange”]')。daterangepicker(“close”); with:$('input [name =“daterange”]')。data('daterangepicker')。hide();