Sprawdź czy wejścia są puste używając jQuery

Każdy ma rację pomysł, ale lubię być trochę bardziej wyraźne i przyciąć wartości.

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

Jeśli nie używasz .długość, wtedy wpis ' 0 ' może zostać oznaczony jako zły, a wpis 5 spacji może zostać oznaczony jako ok bez $.trim . Powodzenia.

Robienie tego na blur jest zbyt ograniczone. Zakłada, że nie było skupić się na polu formularza, więc wolę to zrobić na submit, i map przez wejście. Po latach radzenia sobie z fantazyjnym rozmyciem, skupieniem itp. sztuczki, utrzymanie rzeczy prostsze daje większą użyteczność tam, gdzie się liczy.

$('#signupform').submit(function() {
    var errors = 0;
    $("#signupform :input").map(function(){
         if( !$(this).val() ) {
              $(this).parents('td').addClass('warning');
              errors++;
        } else if ($(this).val()) {
              $(this).parents('td').removeClass('warning');
        }   
    });
    if(errors > 0){
        $('#errorwarn').text("All fields are required");
        return false;
    }
    // do the ajax..    
});

if ($('input:text').val().length == 0) {
      $(this).parents('p').addClass('warning');
}

Możesz również użyć..

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

Jeśli masz wątpliwości co do spacji,spróbuj..

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

Dlaczego nikt nie wspomniał

$(this).filter('[value=]').addClass('warning');

Wydaje mi się bardziej podobne do jquery

Rozważ użycie wtyczki jQuery validation zamiast tego. Może to być nieco przesada dla prostych pól wymaganych, ale jest na tyle dojrzały, że obsługuje przypadki krawędzi, o których jeszcze nie pomyślałeś(ani żaden z nas, dopóki na nie nie wpadliśmy).

Możesz oznaczyć wymagane pola klasą "required", uruchomić $('form').validate () w $(document).gotowe () i tyle wystarczy.

Jest nawet hostowany na Microsoft CDN zbyt, dla szybkiej dostawy: http://www.asp.net/ajaxlibrary/CDN.ashx

Zdarzenie keyup wykryje, czy użytkownik również wyczyścił pole (tzn. backspace podnosi zdarzenie, ale backspace nie podnosi zdarzenia Klawiatura W IE)

    $("#inputname").keyup(function() {

if (!this.value) {
    alert('The box is empty');
}});

Pseudo-selektor :empty jest używany, aby sprawdzić, czy element nie zawiera Potomków, należy sprawdzić wartość:

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

Jest jeszcze jedna rzecz, o której warto pomyśleć, obecnie może ona dodać klasę warning tylko wtedy, gdy jest pusta, co powiesz na ponowne usunięcie klasy, gdy Formularz nie jest już pusty.

Tak:

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

function checkForm() {
  return $('input[type=text]').filter(function () {
    return $(this).val().length === 0;
  }).length;
}

Oto przykład użycia keyup dla wybranego wejścia. Używa również przycięcia, aby upewnić się, że sekwencja znaków zawierających tylko białe spacje nie wywołuje prawdziwej odpowiedzi. Jest to przykład, który może być użyty do rozpoczęcia pola wyszukiwania lub czegoś związanego z tego typu funkcjami.

YourObjNameSpace.yourJqueryInputElement.keyup(function (e){
   if($.trim($(this).val())){
       // trimmed value is truthy meaning real characters are entered
    }else{
       // trimmed value is falsey meaning empty input excluding just whitespace characters
    }
}

$(function() {
  var fields = $('#search_form').serializeArray();
  is_blank = true;
  for (var i = 0; i < fields.length; i++) {
    // excluded fields
    if ((fields[i].name != "locale") && (fields[i].name != "utf8")) {
      if (fields[i].value) {
        is_blank = false;
      }
    }
  }
  if (is_blank) {
    $('#filters-button').append(': OFF');
  }
  else {
    $('#filters-button').append(': ON');
  }
});

Sprawdź, czy wszystkie pola są puste i dołącz do FILTRA_BUTTON

Możesz spróbować czegoś takiego:

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

Zastosuje Zdarzenie .blur() Tylko do wejść z pustymi wartościami.

<script type="text/javascript">
$('input:text, input:password, textarea').blur(function()
    {
          var check = $(this).val();
          if(check == '')
          {
                $(this).parent().addClass('ym-error');
          }
          else
          {
                $(this).parent().removeClass('ym-error');  
          }
    });
 </script>// :)

Z HTML 5 możemy użyć nowej funkcji "wymagane" wystarczy dodać go do tagu, który chcesz być wymagane jak:

<input type='text' required>