jQuery如何检查字段是否为空,如果是这样,则将一个类添加到另一个元素

时间:2014-12-05 07:32:23

标签: javascript jquery html css

我在结帐页面上为邮政编码创建了一个字段,我试图让jQuery检查该字段是否为空。如果该字段为空,则会向id为“zip”的div添加一个“empty”类,如果它不为空,则它将具有id为“zip”的div的“else”类。不知道怎么做这里是我现在的代码。

var value = $.trim($("#billing_zip").val());

 if (value.length > 0) {
     $('#billing_zip').click(function () {
         $('#zip').addClass('empty');
     });
     $('#zip').click(function () {
         $('#zip').addClass('empty');
     });

 }
#zip {
    color: #aaa;
    font-style: italic;
    position: absolute;
    top: 8px;
    left: 35px;
}
.empty {
    display: inline;
  }
.else {
    display: none;
  }
<div class="chkField">
  <label for="billing_zip">Zip</label>
  <input type="text" onchange="clearContent(this);check_address('billing');" class="txtBoxStyle hasPlaceholder" tabindex="10" size="10" value="" id="billing_zip" maxlength="15" name="billing_zip">
  <!--START: req_billing_zip-->
  <img width="12" height="12" alt="" src="assets/templates/common/images/error2.gif">
  <!--END: req_billing_zip-->
  <div class="clear"></div>
  <div id="zip">zip</div>
</div>

这是一个fiddle jQuery甚至没有工作,我只有添加类“空”的代码。 我几乎不知道jQuery。 非常感谢帮助。

谢谢,

安德鲁

2 个答案:

答案 0 :(得分:1)

试试此代码

     $("#billing_zip").on("focusout keypress click",function(){
            var value = $.trim($("#billing_zip").val());
        alert(value.length);
         if (value.length == 0) { 
                $('#billing_zip').addClass('empty');

                 $('#zip').addClass('empty');
         }
     else
     {
       $('#billing_zip').addClass('else');

                 $('#zip').addClass('else');
     }
   });

答案 1 :(得分:-1)

您需要在点击事件中检查值是否为空。

 $('#billing_zip').click(function () {
   var value = $.trim($("#billing_zip").val());
   if(value.length === 0){ 
     $('#zip').addClass('empty');
   }
  });