JavaScript曜日検索ボタンをクリックできないようにするには

Question

JavaScriptで曜日検索したいが入力していない時やおかしい日付の時は検索ボタンを押せないようにするか、曜日を出さないようにしたいです。
年と月だけ入力し検索すれば曜日が出てきてしまいます。if文がおかしいのか、条件が足りないのかコードをみて教えて欲しいです。またこんなやり方もあるよってゆうのがあれば教えてください。

Comments

[jun68ykt]

HTMLも質問に追記したほうがよいでしょう。

[MikMik]

inputYear、inputMonth、inputDateそれぞれconsole.log(inputDate)とかでデバッグしてみましたか？

[jun68ykt]

さきほど
> HTMLも質問に追記したほうがよいでしょう。
と書きましたが、 thyda.eiqauさんの回答で、問題の箇所は指摘されているので、HTML の追記は不要です。

Answer 1

var inputDate = new Date( inputYear, inputMonth - 1, inputDate );
ここで変数 inputDate を上書きしています。第3引数には空文字が渡されて、0にキャストされています。
たとえば #userYear に 2020, #userMonth に 2 と入れたら、次のような計算になります。

var inputDate = new Date( inputYear, inputMonth - 1, inputDate );
/*            = new Date( '2020'   , '2' - 1       , '' );
              = new Date( 2020     , 1             , 0);
              = Jan 31 2020
*/

日付が0日というのは感覚的には不自然ですが、2020年2月1日よりもマイナス1日ということで、2020年1月31日が得られます。
よって、次のif文の3つ目の条件 inputDate !== "" を満たしてしまいます。

Comments

[tensai]

なるほど。わかりやすく説明していただきありがとうございます。
解決しました。ベストアンサーにさせていただきます。

Answer 2

inputDate が２回宣言されています。

MDN let や MDN const を使って宣言すると、重複した宣言を エラーで知ることができます。

---

年、月、日の３つのうち、すべて入力されていることが条件なら、
配列に格納して配列長をチェックする方法があります。

function showUserWeekDay() {
  let inps = [
    document.getElementById("userYear").value||void 0,
    document.getElementById("userMonth").value||void 0,
    document.getElementById("userDate").value||void 0
  ].filter(v=>isFinite(v));

  let answer = document.getElementById("answer");
  answer.innerHTML = "";

  if ( inps.length === 3 ) { // すべて入力されている場合
    let WeekChars = [ "日曜日", "月曜日", "火曜日", "水曜日", "木曜日", "金曜日", "土曜日" ];
    let cmputedDate = new Date( inps[0], inps[1] - 1, inps[2] );
    answer.innerHTML = `結果：${WeekChars[cmputedDate.getDay()}です。`);
  }
}

追記）
ご質問のコードでは、検索ボタンを押したときに「結果」を求めるために入力値をチェックする実装です。
（上記内容もその実装に合わせています）。

JavaScriptで年月日が空白の時は曜日検索ボタンをクリックできないようにするには

検索ボタンの disabled 属性を動的に書き換えることになります。
この場合、別途、入力フォームに変化が起きたときに、3つの値が入力されているかを確認するイベントリスナを定義することになります。

Comments

[tensai]

回答有難うございます。