required
セクション内の()入力フィールドの空の値を確認し、jQueryを使用してイベントでそれらにクラスを追加するにはどうすればよいですか?これまでのところ、私は試しました:
jQuery("#sender_container input.required").val("").addClass("error");
しかし、それは値をチェックするのではなく、設定するようです。何か案は?
required
セクション内の()入力フィールドの空の値を確認し、jQueryを使用してイベントでそれらにクラスを追加するにはどうすればよいですか?これまでのところ、私は試しました:
jQuery("#sender_container input.required").val("").addClass("error");
しかし、それは値をチェックするのではなく、設定するようです。何か案は?
jQuery("#sender_container input.required").filter(function() {
return !this.value;
}).addClass("error");
なぜあなたはこのデモで見ることができるのにあなたが使わなければfilter
ならないのか[value=""]
その理由は次のとおりです。属性セレクターは、現在の状態ではなく、要素の初期状態をチェックします。(関数を使用して「初期」状態を変更できることに注意してください。ただし、attr
これは悪い習慣です。常に使用する必要がありますprop
)
したがって、入力値を変更しても、現在の値は属性セレクターに影響しません。賢明ではない...:)
ノート:
.val()
フォーム要素の値を返し、jQueryチェーンを切断します。
$('selector').val().addClass('foo')
エラー。戻り値は文字列\数値です。
.val(valueToSet)
フォーム要素の値を設定し、jQueryチェーンを壊しません。
$('selector').val("some value").addClass('foo')
-有効、戻り値はjQueryです
$('input:text[value=]','#sender_container').addClass('error');
$('#sender_container input.required[value=""]').addClass('error')
jQuery('#sender_container input.required[value=""]').addClass("error");
あなたはこれを試すことができます:
$('input:not([value!=""])').addClass('error');
注:この回答は使用しないでください。削除されなかった唯一の理由は、そこから学習できるようにするためです。
$field = $("#sender_container input.required");
if( ! $field.val())
{
$field.addClass("error");
}
この簡単な方法でうまくいくかもしれません。
入力の初期属性値のみに基づいて選択する必要がある場合は、次のようにします。
var elements = $('#sender_container input.required[value=""]')
ただし、value
属性が存在しない場合、これは機能しないことに注意してください。また、ユーザーまたはスクリプトによって変更された場合、現在の入力値では機能しません。
現在の入力値を取得したい場合は、jqueryのfilter
関数を使用できます。
var elements = $('#sender_container input.required').filter(function() {
return this.value === '';
// alternatively for "no value":
// return !this.value;
})
jquery要素を選択したら、クラスを追加できます。
elements.addClass('error');
すべてのフィールドを検査するために、これが役立つ場合があります。
$('#sender_container [required]').each(function(index)
{
if (!($(this).val())) $(this).addClass('error');
}
});