14

私は jQuery Validation プラグインを使用しており、有効でない場合は要素の ( <input>) 親 ( <label>) にクラスを追加し、実際のエラー要素 ( <span>) を の前に挿入する次のコードを作成しました<br>。

HTML...

<label>
    text<br><input>
</label>

...そしてjQuery。

$("#form_to_validate").validate({
    rules: {
    ...
    },
    errorElement: "span",
    errorPlacement: function(error, element) {
        element.parent().addClass('error');
        error.insertBefore(element.parent().children("br"));
    }
});

したがって、フォーム要素が検証されない場合は、次のようになります。

<label class="error">
    text<span>error text</span><br><input>
</label>

これはうまく機能しますが、フィールドのコンテンツが修正されて有効になった場合、クラスは明らかにその親から削除されません (実際にはエラー要素も削除されず、代わりにdisplay: none;CSS プロパティを取得するだけです)。要素が有効になるかどうかを確認し、そうであればその親クラスを削除するにはどうすればよいですか?

どんな助けでも大歓迎です！

編集: 詳細情報を追加しました。

4

2 に答える 2

30

もう少し掘り下げた後、私は答えを私の鼻のすぐ下に見つけましたが、残念ながら私にとってはよく隠されていました. プラグインには、ハイライト機能 (サプライズ、サプライズ) が組み込まれています。通常、要素を強調表示/非強調表示しますが、要素の親で機能するように簡単に変換できます。

$("#form_to_validate").validate({
    rules: {
    ...
    },
    errorElement: "span",
    errorPlacement: function(error, element) {
        error.insertBefore(element.parent().children("br"));
    },
    highlight: function(element) {
        $(element).parent().addClass("error");
    },
    unhighlight: function(element) {
        $(element).parent().removeClass("error");
    }
});

これが誰かを助けることを願っています!

于 2010-03-24T05:13:22.287 に答える
0

errorElement: 'none'私のために働いた。

于 2010-09-18T13:53:51.587 に答える