0

次の関数を使用して検証を実行します。

//Validation
$('.sValidate').bind('blur', function() {
    if (!$(this).val()) {
        $(this).removeClass('short_input');
        $(this).addClass('short_input_negative');
        return false;
    }
});

私の入力クラスのほとんどはshort_input. しかし、それらのいくつかは名前も付けられていlong_inputます。をトリガーしたクラスを確認し、それを削除して代わりに追加するに
はどうすればよいですか?inputblurlong_input_negative

<input type="text" id="loginname" name="loginname" class="short_input sValidate" value="JDoe">
4

3 に答える 3

6

.hasClass()クラス検出のメソッドを使用できます。

$('.sValidate').bind('blur',function(){
    if (!$(this).val()){
        if( $(this).hasClass('long_input') ) {
            $(this)
                  .removeClass('short_input');
                  .addClass('short_input_negative');
        }

        if( $(this).hasClass('short_input') ) {
            $(this)
                 .removeClass('long_input');
                 .addClass('long_input_negative');
        }
    }
});

jQueryドキュメントから.hasClass()

一致した要素のいずれかに特定のクラスが割り当てられているかどうかを判断します。

別の方法は.is()

$('.sValidate').bind('blur',function(){
    if (!$(this).val()){
        if( $(this).is('.long_input') ) {
            // do something of long_input
        }

        if( $(this).is('.short_input') ) {
           // do something of short_input
        }
    }
});

jQueryドキュメントから.is()

現在一致している要素のセットをセレクター、要素、または jQuery オブジェクトに対してチェックし、これらの要素の少なくとも 1 つが指定された引数と一致する場合は true を返します。

于 2012-06-29T12:12:04.203 に答える
0

@thecodeparadox が元の質問に回答しましたが、クラスが実際に何をしているのかを知らずに、「あなたは間違ったことをしている」ことを指摘したいと思います。foo_negativeクラスは色を赤または同様にありふれたものに切り替えることになっていると思います。

.short_input {
  width: 50px;
}

.long_input {
  width: 100px;
}

.negative {
  color: red;
}

クラスとクラスを保持しshort_inputlong_inputクラスを追加/削除しnegativeてスタイリングを変更できるようになりました。これを知らなかった場合は、MDN CSSをご覧ください。

于 2012-06-29T12:20:14.530 に答える
0

ここで、値がある場合、この行は を!$(this).val()返します。falseそのため、条件は決して実行されません。

このようにしてください: -

$('.sValidate').bind('blur',function(){
    if ($(this).val().length > 0){
        if ($(this).hasClass('short_input')) {
            $(this).removeClass('short_input');
            $(this).addClass('short_input_negative');
        }
        if ($(this).hasClass('long_input')) {
            $(this).removeClass('long_input');
            $(this).addClass('long_input_negative');
        }
    }
});​

ライブデモを参照

于 2012-06-29T12:51:01.840 に答える