0

.closest() 関数が要素を正しく取得していないか、まったく取得していないため、クラスが div に追加されていません。ここで何が問題なのですか?

HTML:

<div class="half control-group">
        <div class="form-status"></div>
        <?php
        echo form_label('Username', 'username');
        echo form_input(array('name' => 'username', 'maxlength' => 25, 'value' => set_value('username') ));
        ?>
    </div>

JQuery:

success: function(label) {
    $(label).text('');
    $(label).closest('div[class="form-status"]').addClass('success');
    //label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
}

テキストを正しく空白にしていますが、最も近いフォームステータスdivクラスを変更していません...さらに最も近い( '.form-status')を試しましたが、まだ取得できません。validate jQuery プラグインを使用しています。入力を開始すると、入力バーの下に次の HTML が追加されます。

<label for=​"name" generated=​"true" class=​"error valid" style>​​&lt;/label>​

正しい答えを探している人にとって、これはうまくいきました:

label.closest('.control-group').find('div.form-status').addClass('success');
4

3 に答える 3

3

closestは dom ツリーを上るだけで、兄弟は選択されません。

あなたが必要

$(label).prev('div.form-status').addClass('success');

また

$('.half.control-group label').prev('div.form-status').addClass('success');

取得するラベル var が jQuery セレクターであるかどうかによって異なります。

前にコメントしたように、jQuery と CSS の両方にクラスの直接セレクターがあるため'div.form-status''div[class="form-status"]'.

于 2012-12-05T17:56:41.997 に答える
0

私はこれをテストし、非常にうまく機能しています:

$('label').text(''); 
$('label').prev('div[class="form-status"]').addClass('success');
// ---------^---------use this if you want to add class to just previous div at 
//--------------------same level

同じレベルのすべての div にクラスを追加する場合は、これを使用します

$('label').siblings('div[class="form-status"]').addClass('success');
于 2012-12-05T18:16:54.733 に答える
0

問題の半分が説明されました。兄弟を見ていないので、$.prev()使用する必要があります。$.closest()

ただし、問題の2番目の部分はここにあります

// What type is label? Is it a string indicating what's in the 
// for="name"? Is it a jQuery object? a DOM object
success: function(label) {
    $(label).text('');
    $(label).closest('div[class="form-status"]').addClass('success');
    //label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
}

jQuery または HTMLElement オブジェクトが渡されている場合、次のように動作しますhttp://jsfiddle.net/Rdpu7/1/

success: function(label) {
    $(label).prev('div.form-status').addClass('success');
    $(label).text('OK!').addClass('valid').closest('.control-group').addClass('success');        
}

に渡さnameれた が渡されているform_label場合は、次のhttp://jsfiddle.net/Rdpu7/3/を使用できます

success: function(label) {
    var label = $("label[for='"+label+"']");
    label.prev('div.form-status').addClass('success');
    label.text('OK!').addClass('valid').closest('.control-group').addClass('success');  
}

それ以外の場合は、ドキュメントを改善する必要があります。特に、パラメーターがドキュメント化されていない関数は我慢できません。それが混乱の原因だと確信しています。

次の行が機能した理由について

$('label').prev('div.form-status').addClass('success')

それはあなたのページのすべてのラベルを行いますが、これはおそらくあなたが望むものではありません. 単一のラベルを持つ例でのみ機能します。labelあなたの主な問題は、成功関数にあるオブジェクトのタイプがわからないことです

于 2012-12-05T19:26:45.677 に答える