0

私は自分が間違っていることを理解できません。

入力が無効な場合、親 div に背景を追加したい。

つまり、メール入力に hasClass エラーが発生した場合は、field2 に背景を追加します。

ここに私のjsコードがあります:

 $('.login').submit(function() {

 $(':input').each(function() {

 if ($(this).hasClass('valid')) {

 $(".field2").has($(this)).removeClass('bg2').addClass('bg1');
  }
 if ($(this).hasClass('error')) {

 $(".field2").has($(this)).removeClass('bg1').addClass('bg2');

  }
 })

});

私は作業コードを持っています:

 $('input').each(function() {

  if ($(this).hasClass('valid')) {

 $(".field2").has(this).removeClass('bg2').addClass('bg1');
  }
 if ($(this).hasClass('error')) {

 $(".field2").has(this).removeClass('bg1').addClass('bg2');

 }
 })
}
window.setInterval(foo3, 1);

しかし、なぜ以前のバリアントが機能しないのですか?

および HTML:

   <div class="field2">
  <label for="user_email" id="em">E-mail Adress</label>

    <input id="user_email" name="user[email]" size="30" type="email" value="" class="error">
  </div>

私のjQueryに何か問題があります - 誰かが何を提案できますか?

4

3 に答える 3

0

$(':input')代わりにセレクターを使うべきだと思い$('input')ます。

:inputどのDOMElementsとも一致しないためです。

于 2012-10-18T13:03:02.117 に答える
0

closest()この場合、次を使用することをお勧めします。

$('.login').submit(function() {
    $(':input').each(function() {
        if ($(this).hasClass('valid')) {
            $(this).closest('.field2').removeClass('bg2').addClass('bg1');
        }

        if ($(this).hasClass('error')) {
            $(this).closest('.field2').removeClass('bg1').addClass('bg2');
        }
    })
});​
于 2012-10-18T13:04:20.710 に答える
0

これは、ページが送信されると、ページがサーバーにポストバックされるためです。event.preventDefault()を追加してポストバックを停止し、コードの最後に .submit() を追加して再送信します。以下のコードを見てください：

$('input[type="submit"]').click(function(e) {
   e.preventDefault();

   $(':input').each(function() {
      if ($(this).hasClass('valid')) {
      $(".field2").has($(this)).removeClass('bg2').addClass('bg1');
      }
      if ($(this).hasClass('error')) {
      $(".field2").has($(this)).removeClass('bg1').addClass('bg2');
      }
   })

   if ($('input[class="error"]').length == 0) {
      $('.login').submit();
   }
});
于 2012-10-18T13:04:25.277 に答える