如果输入值为空，我需要什么jQuery来隐藏div类？ [英] What jQuery do I need to hide a div class if an input value is empty?

问题描述

在我的选项面板中，我有一个部分，用户可以输入他们的Twitter用户名。目前，如果该字段的值为空，则Twitter图标在我的网站上消失，这很好，因为这意味着div类已成功隐藏。但是，当我在字段中输入用户名时，div类仍然处于隐藏状态。

这是我目前使用的jQuery：

 < script type =text / javascript> 
 $（document）.ready（function（）{
 if（$（'mytheme_twitter：empty'））{$（'。twitter'）。hide（）;} 
}） ; 
< / script> 
  

我认为它必须缺少一些东西。我需要添加另一个功能吗？如果是这样，我把它放在哪里？

解决方案

首先，：empty 是错误的选择器这个用例。

：empty选择所有没有子元素的元素（包括文本节点）

更改逻辑以检查输入值是否为空。

  if（$（'。mytheme_twitter'）。val（）===''）{$（'。twitter'）。hide（）;} 
 

您需要编写一个更改事件来处理这种情况。

  $（'mytheme_twitter'）必须是$（'＃mytheme_twitter'）如果ID OR $（'。mytheme_twitter'）如果Class 
  

$ b $ p

$ $ p $ < script type =text / javascript >
$（document）.ready（function（）{

if（$（'。mytheme_twitter'）。val（）==''）{$（'。twitter' ）.hide（）;}

$（'。mytheme_twitter'）。on（'c如果（this.value！=''）{

$（'。twitter'）。show（）;函数（）{


}
else {
$（'。twitter'）。hide（）;
}
}）;
}）;
< / script>


In my options panel I have a section where the user can enter their Twitter username. Currently if the value for that field is empty, the Twitter icon disappears on my website, which is good as it means the div class has been successfully hidden. However, when I enter a username in the field, the div class still stays hidden.

This is the jQuery I have at the moment:

<script type="text/javascript">
$(document).ready(function() {
if($('mytheme_twitter:empty')){$('.twitter').hide();}   
});
</script>

I think something must be missing from it. Do I need to add another function? If so, where do I put it? I'm a bit of a jQuery noob.

解决方案

Firstly :empty is the wrong selector for this use case.

:empty Select all elements that have no children (including text nodes

Change you logic to check if the value of the imput is empty.

if($('.mytheme_twitter').val() === '' ){$('.twitter').hide();} 

You need to write up a change event to handle that case..

$('mytheme_twitter') has to be   $('#mytheme_twitter')  If ID OR $('.mytheme_twitter') If Class

//

 <script type="text/javascript">
    $(document).ready(function() {

        if($('.mytheme_twitter').val() == '' ){$('.twitter').hide();}  

        $('.mytheme_twitter').on('change' , function() {

             if( this.value != ''){

                   $('.twitter').show(); 
              }
              else{
                   $('.twitter').hide(); 
             }
        });
      });
    </script>

这篇关于如果输入值为空，我需要什么jQuery来隐藏div类？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！