21

送信ボタンをクリックして入力フィールドの値が空の場合、jQuery でアラートを表示するにはどうすればよいですか?

<input type="text" id="myMessage" name="shoutbox_msg" size="16" class="field_nosize" maxlength="150">&nbsp;
<input id="submit" type="submit" name="submit_post" class="button_nosize" value="Senden" onclick="sendMessage(); clearInput();">
4

6 に答える 6

12

より良いものはここにあります。

$('#submit').click(function()
{
    if( !$('#myMessage').val() ) {
       alert('warning');
    }
});

また、空の文字列はとにかく false と評価されるため、必ずしも .length を必要とするか、その >0 かどうかを確認する必要はありませんが、読みやすくするために必要な場合は、次のようにします。

$('#submit').on('click',function()
{
    if( $('#myMessage').val().length === 0 ) {
        alert('warning');
    }
});

常に textfield 要素で動作することが確実な場合は、this.value を使用できます。

$('#submit').click(function()
{
      if( !document.getElementById('myMessage').value ) {
          alert('warning');
      }
});

また、 $('input:text') は複数の要素を取得し、コンテキストを指定するか、単一の要素への参照が必要な場合は this キーワードを使用することに注意してください (コンテキストの子孫/子にテキストフィールドが 1 つある場合)。

于 2016-05-17T06:29:53.180 に答える
0

以下のような入力クラスのすべての入力をチェックする関数を作成できます

 function validateForm() {
  
    var anyFieldIsEmpty = jQuery(".myclass").filter(function () {
        return $.trim(this.value).length === 0;
    }).length > 0

    if (anyFieldIsEmpty) {
        alert("Fill all the necessary fields");
        var empty = $(".myclass").filter(function () {
            return $.trim(this.value).length === 0;
        })
        empty.css("border", "1px solid red");
        return false;
    } else {
        return true;
    }
}

これが行うことは、「myclass」のすべての入力をチェックし、空の場合は警告を発し、入力の境界線に色を付け、ユーザーはどの入力が入力されていないかを認識します。

于 2021-01-12T08:40:31.947 に答える