如何比较两个全年的日期

Question

The idea in my example is to allow user to select only the year in to input already selected in from input (have the same year in from and to date input).

The issue here is that it works fine when we use the date picker but, when we hit manually the date into 'to' input, it compare juste the first number of the year ***8/04/14 , I want to wait until the user finish the full date example 2018/04/14 then I alert OK. I the actual code, if I take the example : from = 2018/04/14 , to = 2018/05/29 , So it compare 2018/04/14 with from = 8/05/29 , it alert ok in the 8 of 2018 and not in the complete year.

 $("#from").on("change", function() { year(); 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(){ year(); }); function year() { var from = $("#from").val(); var to = $("#to").val(); if(from && to && new Date(from).getFullYear() != new Date(to).getFullYear()) { $("#to").val(""); alert("OK"); } } 

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

Answer 1

Try using

$("#to").on("blur", function(){
   year();
});

That should active the check only after the input loses focus.

Answer 2

Change event is triggered when input change, if you want catch user event, or key event you should try to declare all "change code" as stand alone functions and add another eventListener.

Maybe with blur or key down will work as you want but lot of event exist : https://www.w3schools.com/jsref/dom_obj_event.asp