jQuery를 사용하여 입력이 비어 있는지 확인합니다.

jQuery를 사용하여 입력이 비어 있는지 확인합니다.

저는 모든 필드에 기입했으면 하는 양식이 있습니다.필드를 클릭하여 입력하지 않은 경우 빨간색 배경을 표시합니다.

내 코드는 다음과 같습니다.

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

필드의 입력 여부에 관계없이 경고 클래스를 적용합니다.

내가 뭘 잘못하고 있는 거지?

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

꼭 필요한 것은 아닙니다..length아니면 그것이>0위해 하려면: " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " " "

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

텍트필요드소서항작것는동확이다실사있다수습니용할음을스면다하하상에▁use▁if▁just다를 사용하면 됩니다.this.value.

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

또한 당신은 주의해야 합니다.$('input:text') 요소를 잡고,하거나, 여러요소잡컨지사정나용거다합니하를텍고를 합니다.this단독 요소에 대한 참조만 원하는 경우 키워드를 지정합니다(컨텍스트의 하위/하위에 텍스트 필드가 하나 있는 경우).

모든 사람들이 올바른 생각을 가지고 있지만, 저는 조금 더 명확하게 말하고 가치를 다듬고 싶습니다.

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

.length를 사용하지 않으면 '0'의 항목이 잘못된 것으로 플래그가 지정될 수 있으며, $.trim 없이 5개의 공간의 항목이 정상으로 표시될 수 있습니다. 행운을 빕니다.

블러로 하는 것은 너무 제한적입니다.양식 필드에 초점이 맞춰진 것으로 가정하기 때문에 제출할 때 수행하고 입력 내용을 매핑하는 것을 선호합니다.화려한 흐림, 초점 맞추기 등의 속임수를 수년간 처리한 후에는 더 단순하게 유지하면 중요한 부분에서 더 많은 유용성을 얻을 수 있습니다.

$('#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');
}

당신은 또한 사용할 수 있습니다.

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

만약 당신이 우주에 대해 의심이 있다면, 시도해보세요.

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

어째서 아무도 언급하지 않는 거지?

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

내가 보기엔 더 농담처럼 보입니다.

jquery에서 null이 정의되지 않고 비어 있는지 확인하는 방법

  $(document).on('input', '#amt', function(){
    let r1;
    let r2;
    r1 = $("#remittance_amt").val();
    if(r1 === undefined || r1 === null || r1 === '')
    {
      r1 = 0.00;
    }

    console.log(r1);
  });

키업 이벤트는 사용자가 상자를 비웠는지 여부도 감지합니다(즉, 백스페이스는 이벤트를 발생시키지만 백스페이스는 IE에서 키 누름 이벤트를 발생시키지 않습니다).

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

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

대신 jQuery 유효성 검사 플러그인을 사용하는 것이 좋습니다.단순한 필수 필드에는 약간 과잉 살상이 될 수 있지만, 아직 생각지도 못한 에지 케이스를 처리할 수 있을 정도로 충분히 성숙합니다(우리 중 누구도 그들과 마주칠 때까지).

필수 필드에 "필수" 클래스를 태그하고 $('양식')을 실행할 수 있습니다.$($) 단위로 유효성 검사.ready () 그리고 그것이 전부입니다.

빠른 전송을 위해 Microsoft CDN에서도 호스팅됩니다. http://www.asp.net/ajaxlibrary/CDN.ashx

한 가지 더 생각해 보고 싶은 것이 있습니다. 현재 경고 클래스는 비어 있을 때만 추가할 수 있습니다. 양식이 더 이상 비어 있지 않을 때 클래스를 다시 제거하는 것은 어떻습니까.

다음과 같이:

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

그:empty유사 접두사는 요소에 자식이 포함되어 있지 않은지 확인하는 데 사용됩니다. 값을 확인해야 합니다.

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

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

다음은 선택한 입력에 대해 키업을 사용하는 예입니다.또한 트림을 사용하여 공백 문자의 시퀀스가 진실한 응답을 유발하지 않도록 합니다.이것은 검색 상자 또는 해당 기능 유형과 관련된 것을 시작하는 데 사용할 수 있는 예입니다.

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');
  }
});

모든 필드가 비어 있는지 확인하고 Filter_button에 ON 또는 OFF를 추가합니다.

다음과 같은 방법을 사용할 수 있습니다.

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

적용됩니다..blur()빈 값을 가진 입력에만 이벤트가 발생합니다.

사용해 보십시오.

function empty(){
        if ($('.text').val().length == 0)
        {
            alert("field should not be empty");
        }
    }

<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>// :)

HTML 5를 사용하면 다음과 같이 태그에 필요한 새 기능 "필수"를 추가할 수 있습니다.

<input type='text' required>

훌륭한 답변 모음으로, 당신은 또한 이것을 사용할 수 있다는 것을 추가하고 싶습니다.:placeholder-shownCSS 선택기.IMO를 사용하기에 조금 더 깔끔합니다. 특히 이미 jQ를 사용하고 있고 입력에 자리 표시자가 있는 경우에는 더욱 그렇습니다.

if ($('input#cust-descrip').is(':placeholder-shown')) {
  console.log('Empty');
}

$('input#cust-descrip').on('blur', '', function(ev) {
  if (!$('input#cust-descrip').is(':placeholder-shown')) {
    console.log('Has Text!');
  }
  else {
    console.log('Empty!');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="text" class="form-control" id="cust-descrip" autocomplete="off" placeholder="Description">

또한 다음을 사용할 수 있습니다.:valid그리고.:invalid필요한 입력이 있는 경우 선택합니다.입력에 필요한 특성을 사용하는 경우 이러한 선택기를 사용할 수 있습니다.

깨끗한 CSS 전용 솔루션은 다음과 같습니다.

input[type="radio"]:read-only {
        pointer-events: none;
}

입력 텍스트에 이 코드를 사용하십시오.

$('#search').on("input",function (e) {

});

if($("#textField").val()!=null)

나를 위한 이 일

언급URL : https://stackoverflow.com/questions/1854556/check-if-inputs-are-empty-using-jquery