javascript - 日期范围还可以过滤另一个月份的同一天吗?

标签 javascript jquery date filter date-range

我正在使用dt-date_range_filter ,我的日期格式是 yyyy-mm-dd

将最小日期设置为 2015-09-11,将最大日期设置为 2015-09-24 也会返回日期为 2015-10 的结果-15,如下所示:

screenshot

这是我的待命代码:

<script type="text/javascript" language="javascript" class="init">

$(document).ready(function() {

    $(function() {
        $( "#min" ).datepicker();
    });

    $(function() {
        $( "#max" ).datepicker();
    });

    var table = $('#example').DataTable( {

    lengthChange: true,
         buttons: [
            'print'
        ],
        "oSelectorOpts": {
            page: 'current'
        },

        "footerCallback": function ( row, data, start, end, display ) {
            var api = this.api(), data;

            // Remove the formatting to get integer data for summation
            var intVal = function ( i ) {
                return typeof i === 'string' ?
                    i.replace(/[\$,]/g, '')*1 :
                        typeof i === 'number' ?
                            i : 0;
            };

            // Total over all pages
            total = api
                .column( 5 )
                .data()
                .reduce( function (a, b) {
                    return intVal(a) + intVal(b);
                } );

            // Total over this page
            pageTotal = api
                .column( 5, { page: 'current'} )
                .data()
                .reduce( function (a, b) {
                    return intVal(a) + intVal(b);
                }, 0 );

            // Update footer
            $( api.column( 5 ).footer() ).html(
                '<center>Total Sales <br>'+'P '+ pageTotal+'.00'
            );
        }
    } );
    $('#min').change( function() { table.fnDraw(); } );
    $('#max').change( function() { table.fnDraw(); } );
    table.buttons().container()
        .appendTo( '#example_wrapper .col-sm-6:eq(0)' );
} );

</script>

好像根本没有过滤,因为另一个月份的同一天也被过滤了?

$.fn.dataTableExt.afnFiltering.push(
    function( oSettings, aData, iDataIndex ) {

        var today = new Date();
        var dd = today.getDate();
        var mm = today.getMonth() + 1;
        var yyyy = today.getFullYear();

        if (dd<10)
        dd = '0'+dd;

        if (mm<10)
        mm = '0'+mm;

        today = yyyy+'-'+mm+'-'+dd;

        if ($('#min').val() != '' || $('#max').val() != '') {
        var iMin_temp = $('#min').val();
        if (iMin_temp == '') {
            iMin_temp = '1980-01-01';
        }

        var iMax_temp = $('#max').val();
        if (iMax_temp == '') {
            iMax_temp = today;
        }

        var arr_min = iMin_temp.split("-");
        var arr_max = iMax_temp.split("-");
        var arr_date = aData[7].split("-");

        var iMin = new Date(arr_min[2], arr_min[0], arr_min[1], 0, 0, 0, 0)
        var iMax = new Date(arr_max[2], arr_max[0], arr_max[1], 0, 0, 0, 0)
        var iDate = new Date(arr_date[2], arr_date[0], arr_date[1], 0, 0, 0, 0)

        if ( iMin == "" && iMax == "" )
        {
            return true;
        }
        else if ( iMin == "" && iDate < iMax )
        {
            return true;
        }
        else if ( iMin <= iDate && "" == iMax )
        {
            return true;
        }
        else if ( iMin <= iDate && iDate <= iMax )
        {
            return true;
        }
            return false;
        }
    }
);

最佳答案

您使用 Date 的方式有误JavaScript 中的构造函数。

Creates a JavaScript Date instance that represents a single moment in time. Date objects are based on a time value that is the number of milliseconds since 1 January, 1970 UTC.

Constructor

new Date();
new Date(value);
new Date(dateString);
new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);

您使用的最后一个构造函数的顺序是年、月、日

但是,您的代码执行此操作,解释一下:

'2015-10-15'.split("-");

返回这个数组:

[0]: "2015"
[1]: "10"
[2]: "15"

然后你可以这样写:

new Date(arr_date[2], arr_date[0], arr_date[1], 0, 0, 0, 0)

这意味着:

new Date("15", "2015", "10", 0, 0, 0, 0)

您输入的顺序是日、年、月,导致日期错误。

您当前的输入结果如下:

min:  Array [ "2015", "09", "11" ]
max:  Array [ "2015", "09", "24" ]
date: Array [ "2015", "10", "15" ]

min:  Date 2078-12-08T23:00:00.000Z
max:  Date 2091-12-08T23:00:00.000Z
date: Date 2082-12-09T23:00:00.000Z

您生成了错误的日期,导致过滤器失败,因为 2082-1​​2-09T23:00:00.000Z 确实在 2078-12-08T23:00:00.000Z 之间和2091-12-08T23:00:00.000Z

因此正确的代码如下:

var iMin  = new Date( arr_min[0],  arr_min[1],  arr_min[2], 0, 0, 0, 0);
var iMax  = new Date( arr_max[0],  arr_max[1],  arr_max[2], 0, 0, 0, 0);
var iDate = new Date(arr_date[0], arr_date[1], arr_date[2], 0, 0, 0, 0);

关于javascript - 日期范围还可以过滤另一个月份的同一天吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33058019/

相关文章:

jquery - knockout 映射 JSON 更新现有 View 模型

python - 在 Python 中将日期与字符串分离

java - 查找给定日期中第一次出现的星期日

javascript - 在提交到 PHP 之前,如何使用 AJAX 从选择标签中获取数据?

jquery - 在 Bootstrap Carousel 中嵌入 Google map

jquery - 功能内的功能不起作用

sql - 日期转换问题。 : yyyy/MM/dd to dd/MM/yyyy

javascript - 重复的 JavaScript 倒计时

javascript - 设置输入值显示 [object HTMLInputElement] Angular

javascript - 函数无法正确读取值