如何在两个日期中输入相同的年份？

Question

我有两个日期输入“ from”和“ To”，我希望输入中的年份在两个日期都相同

示例：

1. 如果用户在“来自”输入中选择“ 11/03 / 2017 ”，则可以在“至”输入中选择直到“ 31/12 / 2017 < / strong>“

2. 如果用户在“来自”输入中选择“ 06/07 / 2014 ”，则可以在“至”输入中进行选择，直到“ 31/12 / 2014 < / strong>“

（年份不得超过或早于已选择的年份）

如果用户尝试选择第一个输入中不存在的其他年份，我们将显示一些警告消息。

    $("#from").on("change", function() {
        validateYear();
        var from = $("#from").val();
        if (from) {
          var maxYear = new Date(from).getFullYear();
          $("#to").attr("max", maxYear+"-12-31");
          $("#to").attr("min", maxYear+"-01-01");
        }
    });

    $("#to").on("change", function(){
        validateYear();
    });

    function validateYear() {
        var from = $("#from").val();
        var to = $("#to").val();
        if(from && to && new Date(from).getFullYear() != new Date(to).getFullYear()) {
            $("#to").val("");
            alert("error");
        }
    }

.from, .to {
    padding:20px;
    text-transform:uppercase;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="from">From</span>
<input id="from" type="date">
<span class="to">To</span>
<input id="to" type="date">

Answer 1

基本逻辑是：

    $("#from").on("change", function() {
        validateYear();
        var from = $("#from").val();
        if (from) {
          var maxYear = new Date(from).getFullYear();
          $("#to").attr("max", maxYear+"-12-31");
          $("#to").attr("min", maxYear+"-01-01");
        }
    });

    $("#to").on("change", function(){
        validateYear();
    });

    function validateYear() {
        var from = $("#from").val();
        var to = $("#to").val();
        if(from && to && new Date(from).getFullYear() != new Date(to).getFullYear()) {
            $("#to").val("");
            alert("error");
        }
    }