htmlのinputタグに関して

Question

inputタグで名前やメールアドレスの入力枠を作りたいと思い、設置はできたのですが、必須項目を入力しなかっった場合のアラートを鳴らしたいのですが、上手くできません。requiredを指定はしてみたのですが、できなかったです。

Comments

[maisumakun]

・実行しているブラウザはなんですか？
・アラートは、どのような場面で表示したかったのでしょうか？

[m.ts10806]

「うまくいかない」「できない」では何も伝わりません。
再現できるコード、操作手順、環境全てご提示ください

[Lhankor_Mhy]

結果（実際に起きたこと）を書きましょう
https://teratail.com/help/question-tips#questionTips3-4-1

エラーメッセージや実行ログをコピー&ペーストしましょう
https://teratail.com/help/question-tips#questionTips3-4-2

ソースコードを書きましょう
https://teratail.com/help/question-tips#questionTips3-5-1

期待した処理結果を書きましょう
https://teratail.com/help/question-tips#questionTips3-4-3

問題が発生する条件を具体的に書きましょう
https://teratail.com/help/question-tips#questionTips3-5-3

Answer 1

window.addEventListener('DOMContentLoaded', ()=>{
  document.querySelectorAll('[required]').forEach(x=>{
    x.addEventListener('invalid',()=>{
      alert("入力ちゃんとして！");
    });
  });
});

Comments

[yambejp]

ただし、alertはうざいので、エラーをinput要素の後ろに書いたり
した方が良いと思います