jquery - html 输入更改背景值不等于 0

Question

这个问题之前有人问过，但是，在使用了描述的许多方法之后，我无法让它工作。

当用户关注输入框以及里面有文本时，我正在尝试更改 div 的背景，即 != 0。我可以让焦点工作，但模糊功能无法正常工作。

jQuery:

$('.pI_nameText1').focus( function() {
   $(".nameLights").addClass("lightOverlay");
});
$('.pI_nameText1').blur( function() {
   $(".nameLights").removeClass('lightOverlay');
   if ( $(".pI_nameText1").val == '') {
       $('.nameLights').removeClass("lightOverlay");
   }
});

HTML:

<input id="comments" placeholder="Type many lines of texts in here and you will see magic stuff" class="pI_nameText1"></input>
<div class="nameLights"></div>

这是一个 fiddle :http://jsfiddle.net/3fnzL/

我认为问题可能与我如何编写 if 语句有关...

Answer 1

我相信这是 proper answer .您应该使用 .val() 而不是 .val，我还更改了 if 语句的顺序以使其更符合逻辑:

$('.pI_nameText1').blur( function() {
    if ($(".pI_nameText1").val() == '') {
        $(".nameLights").removeClass('lightOverlay')
    }
});

以后，您应该使用console.log(); 进行调试。使用 console.log($(".pI_nameText1").val) 它返回了一个对象，而不是一个字符串，这清楚地表明了问题所在。您可以使用 F12 在大多数浏览器中访问控制台，或者通过右键单击、选择检查元素并在开发人员窗口中找到控制台选项卡。