jQuery kullanarak girişlerin boş olup olmadığını kontrol edin

Tüm alanların doldurulmasını istediğim bir formum var. Bir alana tıklanırsa ve doldurulmazsa, kırmızı bir arka plan görüntülemek istiyorum.

İşte benim kodum:

$('#apply-form input').blur(function () {
  if ($('input:text').is(":empty")) {
    $(this).parents('p').addClass('warning');
  }
});

Alanın doldurulup doldurulmadığına bakılmaksızın uyarı sınıfını uygular.

Neyi yanlış yapıyorum?

Danil Speransky
Edited question 2012ööp14öö11 Eylül 2012 в 11:14
Programlama
jquery validation
2009ööp34öö6 Aralık 2009 в 6:34
37 görünümler
Çözüm
$('#apply-form input').blur(function()
{
    if( !$(this).val() ) {
          $(this).parents('p').addClass('warning');
    }
});

Boş bir dize zaten false olarak değerlendirildiği için .length' değerine ya da>0' olup olmadığına bakmanıza gerek yoktur, ancak okunabilirlik amacıyla isterseniz bunu yapabilirsiniz:

$('#apply-form input').blur(function()
{
    if( $(this).val().length === 0 ) {
        $(this).parents('p').addClass('warning');
    }
});

Her zaman bir textfield öğesi üzerinde çalışacağından eminseniz, o zaman sadece this.value kullanabilirsiniz.

$('#apply-form input').blur(function()
{
      if( !this.value ) {
            $(this).parents('p').addClass('warning');
      }
});

Ayrıca, $('input:text') ifadesinin birden fazla öğeyi yakaladığına dikkat edin, bir bağlam belirtin veya yalnızca tek bir öğeye referans istiyorsanız this anahtar sözcüğünü kullanın (bağlamın alt öğelerinde/çocuklarında bir metin alanı olması koşuluyla).

Paul Roub
Edited answer 2017ösp42ös18 Ocak 2017 в 6:42
Yorumlar (4)
 
if ($('input:text').val().length == 0) {
      $(this).parents('p').addClass('warning');
}
Graviton
Edited answer 2009ööp51öö6 Aralık 2009 в 6:51
Yorumlar (2)

Bir elemanın hiçbir alt eleman içermediğini görmek için :empty sözde seçicisi kullanılır, değeri kontrol etmelisiniz:

$('#apply-form input').blur(function() {
     if(!this.value) { // zero-length string
            $(this).parents('p').addClass('warning');
     }
});
Yorumlar (0)