5

「必須」のクラスを持つ5つのフィールドを持つフォームがあります

送信時にこれらのフィールドが空でないことを確認しようとしています。空の場合はクラスを追加し、そうでない場合はtrueを返します。フィールドが空の場合でもフォームが送信する場合でも、運がない場合にのみ次のことを試みました。

$('.submit').click(function(){

if($('.required').val() == "") {
        $('.required').addClass('error');
        return false;
    } else {
        return true;
    };
});
4

5 に答える 5

5

試す：

$('.submit').click(function(e){
 if(!$('.required').val()) {
    $('.required').addClass('error');
    e.preventDefault();
  } else {
    return true;
  };
});
于 2013-03-22T16:25:49.287 に答える
1

これを試して：

$('.submit').click(function() {
    $('.required').removeClass('error').filter(function() {
        return !$.trim(this.value).length;
    }).addClass('error');
});

クラスerrorは空のフィールドにのみ追加され、それ以外の場合は削除されます。

http://jsfiddle.net/dfsq/2HxaF/

タスクに役立つ可能性のある別のバリ​​エーション：フィールドブラーの追加検証：

$('.submit').click(validate);
$(document).on('blur', '.required', function() {
    validate($(this));
});

function validate($field) {
    ($field instanceof jQuery && $field || $('.required')).removeClass('error').filter(function() {
        return !$.trim(this.value).length;
    }).addClass('error');
}

http://jsfiddle.net/dfsq/2HxaF/1/

于 2013-03-22T16:33:02.747 に答える
0

空のフィールドを取得するには、フィルターを使用する必要があります。フォームの送信も、Enter キーの押下を処理するために使用する方が適切です。そうでない場合は、フォームの送信イベントをトリガーするフォーム内のEnterキーの押下を処理する必要があります

$('yourform').submit(function(){
    // empty will contain all elements that have empty value
    var empty = $('.required').filter(function(){
        return $.trim(this.value).length === 0;
    });
    if(empty.length){
       empty.addClass('error');
       return false;
    }
});
于 2013-03-22T16:30:19.473 に答える
0

if($('.required')は jQuery オブジェクトのコレクションを返しますが、 への呼び出し.val()はそのコレクションの最初の要素のみを使用してテストを実行します。

次のようなことを試してください（編集：ループやテストを行う必要はありません.filter exprがそれを処理してくれるからです）：

$('.submit').click(function(e) {
    var ins = $('input.required[value=""]');         
        ins.addClass('error');
        return false;
   }
    return true;
 }
于 2013-03-22T16:28:54.123 に答える
0

パーティーには少し遅れましたが、これが最善の解決策だと思います。

入力されていないすべての必須フィールドを置き換えます: http://jsfiddle.net/LREAh/

$('form').submit(function(){
if(!$('.required').val()) {
    $('.required').attr('placeholder', 'You forgot this one');
    return false;
    } else {
        return true;
};
});

送信されたフォームの必須フィールドのみを置き換えます: http://jsfiddle.net/MGf9g/

$('form').submit(function(){
if(!$(this).find('.required').val()) {
    $(this).find('.required').attr('placeholder', 'You forgot this one');
    return false;
} else {
    return true;
}
});

もちろん、変更することもできますattr('placeholder', 'You forgot this one');--addClass('error');これはデモンストレーションのみでした。ところで、htmlは必要ありませんid="formX"。何か他のことを試していたので、削除するのを忘れていました。

于 2013-03-22T17:09:44.140 に答える