入力された値が範囲内かを確認したい

Question

前提・実現したいこと

入力された日付が、あらかじめ決められた日付の範囲内かを確認したいです。

どのようにすれば判別できるのかわからなかったので、

入力された日付、決められた日付2つ

上記をミリ秒に直して大小関係による条件分岐を行おうと考えました。

発生している問題・エラーメッセージ

範囲内にしても、範囲外にしても「範囲内」(OK)判定になってしまいます。

該当のソースコード

  <form>
    年月日:<input type="text" id="year" value="" style="width:100px;" placeholder="例:2020/01/01"><br><br>
    <input type="button" id="btn" value="確認"><br><br>
  </form>

  <p id="error"></p><br><br>
  <p id="answer"></p>



var answer = document.getElementById('answer');
var error = document.getElementById('error');
var year = document.getElementById('year');

function calc_day(range1,range2,range3){
  var today1 = new Date(range1,range2,range3);
  var time1 = today1.getTime();
  return time1;
}

year.addEventListener('focusout',function(){
  if (!year.value.match(/^\d{4}/\d{2}/\d{2}$/)){
    error.innerHTML = '不正です';
    answer.innerHTML = ' ';
  }
    var year_num = year.value;
    var y = year_num.split("/")[0];
    var m = year_num.split("/")[1] - 1;
    var d = year_num.split("/")[2];
    var change_year = new Date(y,m,d);
  if(change_year.getFullYear() != y || change_year.getMonth() != m || change_year.getDate() != d){
    answer.innerHTML = ' ';
    error.innerHTML = '不正です';
  } else{
      error.innerHTML = ' ';
        btn.addEventListener('click',function(){
          var time2 = change_year.getTime(); 
          if(calc_day(1995,0,2) <= time2 <= calc_day(2015,(12 - 1),30)){
            answer.innerHTML = 'OKです';
          } else {
            answer.innerHTML = 'NOです';
          }
        }, false);
  }
}, false);

試したこと

console.log で3つの時間を出力すると、ミリ秒で表示され大小関係も「OK」、「NO」になるはずなのですが、上手くいきませんでした。

Answer 1

if(calc_day(1995,0,2) <= time2 <= calc_day(2015,(12 - 1),30)){

って、
if(（calc_day(1995,0,2) <= time2　） <= calc_day(2015,(12 - 1),30)){
という判定文になりますよ

＃あえて全角カッコ

Comments

[退会済みユーザー]

ありがとうございます。

if(calc_day(1995,0,2) <= time2　&& time2 <= calc_day(2015,(12 - 1),30))

に書き換えたら正常に動きました。

恐れ入りますが、なぜ私が最初に書いたコードだと、

if(（calc_day(1995,0,2) <= time2　） <= calc_day(2015,(12 - 1),30)){

になるのかヒントをいただけますでしょうか？

[y_waiwai]

比較はあくまで２値の比較でしかないからです
また、優先順位が同じ演算は、左から順番に行われます
左側の<=の比較がまず先に行われ、その結果を持って右側の<=が行われます

[退会済みユーザー]

ご丁寧にありがとうございます。

理解できました。

Answer 2

めんどうであればdatepickerなどを利用されるとよいでしょう。
inputの制限ならpatternでもある程度までは入力を調整できます

Comments

[退会済みユーザー]

ありがとうございます。

datepickerやpatternというのは初めて聞いたので、後ほど調べさせていただきます。
正規表現等の勉強中につき、上記のようなコードを書いております。