通过javascript比较页面上的多个日期字段

如何有效地比较页面上给定日期的动态日期数

考虑以下代码：

<div id="dateFields">
    <input type="date" id="date1"/>
    <input type="date" id="date2"/>
    <input type="date" id="date3"/>
    <input type="date" id="date4"/>
    <input type="date" id="date5"/>
</div>
<div id="masterDate">
    <input type="date" id="comparator"/>
</div>
<button onClick="compareDate()">Compare Now</button>

编辑2: 用示例解释需求

不需要任何文本框，它可能只是一组

，

，也可能只是一个包含日期数的

，日期数可能从最少2个日期到最多50个日期不等（例如）

我只是在寻找一种逻辑，因此尝试使用文本框

< P>一个实时的例子，考虑一个城市管理系统，它记录了那个城市每月死亡的情况。现在，一位职员想知道该月15日之后死亡的公民的详细情况，他将如何获得数据？

函数compareDate（）{
function compareDate() {
  var dateFields = document.getElementById('dateFields').getElementsByTagName('input');
  var comparatorDate = new Date(document.getElementById('comparator').value);
  var rslt = [];
  for (var i = 0; i < dateFields.length; i++) {
    if (new Date(dateFields[i].value) > comparatorDate) rslt.push(dateFields[i].value);
  }
  return rslt;
}

var dateFields=document.getElementById（'dateFields'）.getElementsByTagName（'input'）；
var comparatorDate=新日期（document.getElementById（'comparator'）.value）；
var rslt=[]；
对于（var i=0；icomparatorDate）rslt.push（dateFields[i].value）；
}
返回rslt；
}

---

这是在chrome中测试的，您可以通过以下方式完成：

 <script>
            function compareDate() {
                var v1 = document.getElementById("date1").value;
                var v2 = document.getElementById("date2").value;
                var v3 = document.getElementById("date3").value;
                var v4 = document.getElementById("date4").value;
                var v5 = document.getElementById("date5").value;
                var v6 = document.getElementById("comparator").value;
                var v7 = [ v1, v2, v3, v4, v5 ];
                var finalResult = "";
                for (k = 0; k < v7.length; k++) {
                    if (solidify(v6) < solidify(v7[k])) {
                        finalResult += v7[k];
                        finalResult += " and ";

                    }

                }
                document.getElementById("result").innerHTML = finalResult;
            }
            function solidify(date) {
                var result = '';
                for (i = 0; i < date.length; i++) {
                    if (date.charAt(i) == '-') {
                        continue;
                    } else {
                        result += date.charAt(i);

                    }

                }
                return result;
            }
        </script>

函数compareDate（）{
var v1=document.getElementById（“date1”）.value；
var v2=document.getElementById（“date2”）.value；
var v3=document.getElementById（“date3”）.value；
var v4=document.getElementById（“date4”）.value；
var v5=document.getElementById（“date5”）.value；
var v6=document.getElementById（“comparator”）.value；
var v7=[v1，v2，v3，v4，v5]；
var finalResult=“”；
对于（k=0；k

以下代码满足您的要求，但仍有一些要求需要确定，以使其真正“通用”（请参见下面的代码）：

HTML

<div id="dateFields">
    <input type="date" id="date1"/>
    <input type="date" id="date2"/>
    <input type="date" id="date3"/>
    <input type="date" id="date4"/>
    <input type="date" id="date5"/>
</div>

<div id="masterDate">
    <input type="date" id="comparator"/>
</div>

<div id="results">
    Results: <span id="resultDates"></span>
</div>

<button onClick="compareDate()">Compare Now</button>

。其中，

aDateGroup

是

Date

对象的数组，

dCompareDate

也是

Date

对象

函数将接收日期，比较它们，并传回通过测试的日期。然后，您可以在返回的数组中循环，并根据需要处理这些日期

这还允许您传入来自任何源的日期（例如，您在第二次更新中提到的

、

和

元素的集合），只要它们首先转换为正确的

日期

对象

确定在比较时是否需要灵活。

通过在比较函数中添加一些灵活性，通过添加一些参数来指示要进行哪种比较，上述“理想代码”实际上可以变得更加“理想”：

function compareDate(aDateGroup, dComparisonDate, sCompareDirection, bIncludeComparisonDate)
    var aPassedDates = [];

    for (i = 0; i < aDateGroup.length; i++) {
        if (sCompareDirection === "before") {
            if (bIncludeComparisonDate) {
                if (dCompareDate >= aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
            else {
                if (dCompareDate > aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
        }
        else if (sCompareDirection === "after") {
            if (bIncludeComparisonDate) {
                if (dCompareDate <= aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
            else {
                if (dCompareDate < aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
        }
        else {
            if (dCompareDate == aDateGroup[i]) {
                aPassedDates.push(aDateGroup[i]);
            }
        }
    }

    return aPassedDates;
}

function compareDate（aDateGroup、dComparisonDate、scompareRedirection、bIncludeComparisonDate）
var aPassedDates=[]；
对于（i=0；i=aDateGroup[i]）{
aPassedDates.push（aDateGroup[i]）；
}
}
否则{
if（dCompareDate>aDateGroup[i]）{
aPassedDates.push（aDateGroup[i]）；
}
}
}
else if（scomparredirection==“after”）{
if（bincludecomparisonate）{
如果（D比较），我们将不为您做工作。如果您陷入困境，请向我们展示您迄今为止所做的工作，我们将为您提供帮助。您还缺少许多关键信息……什么样的比较（之前？之后？相等？所有三者？），单独或作为一组进行比较（即，如果其中一个日期满足某些要求，则停止比较？），如何指示/存储比较结果等。我可以告诉您的一件事是，由于您的日期中没有包含“day”值，因此您需要设置一个标准值，以便创建
日期
对象。我建议插入一个“1”将输入值从“2014年1月1日”格式更改为“2014年1月1日”格式。这是
日期
构造函数的有效参数，所有月份都以第一天为一天，因此有效性不会出现问题。好的，让我编辑并发布我尝试使用的代码。这不起作用。
.value
属性将返回字符串值…您将执行字符串比较我假设用户使用日期选择器或根据正确的格式输入日期，这至少在Chrome中是有效的，因为输入字段类型是“Date”，但请参见上面的修复程序，唯一的问题是他提供的数据样本（例如。，“2105年3月”）是
Date
构造函数的无效字符串输入，因此它将导致一个无效的
Date
对象。它还需要一个day值（例如“2015年3月1日”）才有效。@Vibhor Dube没有提到他使用的浏览器。它对ChromeFair非常有效，但我建议
<script>
    function compareDate() {
        var aDates = document.getElementById("dateFields").getElementsByTagName("input");
        var sCompareDate = document.getElementById("comparator").value;
        var dCompareDate = formatDate(sCompareDate);
        var result = "";

        for (i = 0; i < aDates.length; i++) {
            var sCurrDate = aDates[i].value;

            if (dCompareDate < formatDate(sCurrDate)) {
                if (result.length > 0) {
                    result += ", ";
                }

                result += sCurrDate;
            }
        }

        if (result === "") {
            result = "No dates less than " + sCompareDate;
        }

        document.getElementById("resultDates").innerHTML = result;
    }

    function formatDate(sDate) {
        var regMonthYear = /[a-z]{3}, \d{4}/i;

        if (regMonthYear.test(sDate)) {
            sDate = sDate.replace(",", " 1,");
        }

        return new Date(sDate);
    }
</script>

function compareDate(aDateGroup, dComparisonDate)
    var aGreaterThanDates = [];

    for (i = 0; i < aDateGroup.length; i++) {
        if (dCompareDate < aDateGroup[i]) {
            aGreaterThanDates.push(aDateGroup[i]);
        }
    }

    return aGreaterThanDates;
}

function compareDate(aDateGroup, dComparisonDate, sCompareDirection, bIncludeComparisonDate)
    var aPassedDates = [];

    for (i = 0; i < aDateGroup.length; i++) {
        if (sCompareDirection === "before") {
            if (bIncludeComparisonDate) {
                if (dCompareDate >= aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
            else {
                if (dCompareDate > aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
        }
        else if (sCompareDirection === "after") {
            if (bIncludeComparisonDate) {
                if (dCompareDate <= aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
            else {
                if (dCompareDate < aDateGroup[i]) {
                    aPassedDates.push(aDateGroup[i]);
                }
            }
        }
        else {
            if (dCompareDate == aDateGroup[i]) {
                aPassedDates.push(aDateGroup[i]);
            }
        }
    }

    return aPassedDates;
}