1. ホーム
  2. jquery

[解決済み] jQueryを使って入力が空かどうかをチェックする

2022-01-26 11:36:01

質問

すべてのフィールドに入力されるようにしたいフォームがあります。もし、あるフィールドがクリックされた後、入力されなかった場合、赤い背景を表示させたいと思っています。

以下は私のコードです。

$('#apply-form input').blur(function () {
  if ($('input:text').is(":empty")) {
    $(this).parents('p').addClass('warning');
  }
});

フィールドが埋まっているかどうかに関係なく、警告クラスを適用します。

何が間違っているのでしょうか?

どうすればいいですか?

$('#apply-form input').blur(function()
{
    if( !$(this).val() ) {
          $(this).parents('p').addClass('warning');
    }
});

また、必ずしも .length であるかどうかを確認したり >0 空文字列はいずれにせよ false と評価されるので、可読性のためにそうしたい場合。

$('#apply-form input').blur(function()
{
    if( $(this).val().length === 0 ) {
        $(this).parents('p').addClass('warning');
    }
});

もし、常にテキストフィールド要素で動作することが確実なら、単に this.value .

$('#apply-form input').blur(function()
{
      if( !this.value ) {
            $(this).parents('p').addClass('warning');
      }
});

また、注意しなければならないのは $('input:text') は複数の要素を掴んでいるので、コンテキストを指定するか、あるいは this キーワードは、単独の要素への参照が必要な場合に使用します (ただし、コンテキストの子孫/子要素にテキストフィールドが 1 つだけある場合)。