0

ユーザーがフォーム フィールドに有効なデータを入力しないと、HTML ラベルにエラー メッセージを表示するフォームがあります。ラベルはフォーム フィールド onBlur の下に表示され、データがフォーム フィールドに入力されるまでそこにとどまります。永続的に表示するのではなく、ユーザーがフォーム フィールドに戻ったときにのみラベルを表示したいと思います。以下は、ユーザーがフォーム フィールドからタブを押したときにエラー ラベルを非表示にしようとしているスクリプトです。効果的に非表示にできるようになったら、再び表示することを心配することにしました。

HTMLは次のとおりです。

  <div class="field">
     <input type="text" name="firstname" id="firstname" class="error has-error">
     <label for="firstname" class="error">First Name is required.</label>
  </div>

そして、スクリプト

<script type="text/javascript">
    if($('.fieldset #firstname').hasClass('error')) {
    $(this).blur($('.field label')).hide();
     }
</script>
4

2 に答える 2

0

次のように、関数をコールバックとして .blur() 関数に渡す必要があります。

$(".fieldset #firstname").blur(function(evt) {
    if($(this).hasClass('error')) {
        $(".field label", $(this).parent()).hide();
    }
});

$(this) の parent() のコンテキスト内で .field ラベル セレクターを実行していることに注意してください。$(this) は #firstname を参照するため、親を取得すると、そのノード ツリー内で簡単に選択でき、ページ内の他の .field ラベルを誤って取得することはありません。

于 2013-08-28T18:50:26.120 に答える