如果另一个有价值,jQuery显示/隐藏一个div

时间:2012-05-21 08:11:15

标签: jquery

我有以下代码:

<div class="field-name-new">
  <div class="field-label">New</div>
  <div class="field-items">
    <div class="field-item">0</div>
  </div>
</div>

只有当div.field-item的值为1时我才需要显示div.field-label,如果值为0则隐藏它。

7 个答案:

答案 0 :(得分:3)

var $item = $('.field-item');

if ($item.text() == 0)​​ {
    $item.parent().siblings('.field-label').hide();
}​

http://jsfiddle.net/zerkms/FTbBT/

答案 1 :(得分:2)

根据条件使用toggle method显示或隐藏元素:

$('.field-label').toggle($('.field-item').text() == '1');

答案 2 :(得分:1)

$(document).ready(function(){
 $('.field-item').each(function(){
       if($(this).text() == 0){
            $(this).parent().prev().hide();
       }else{
           $(this).parent().prev().show();
    }
    });
    });

答案 3 :(得分:1)

$('.field-label').each(function() {
       $(this).css('display', $(this).next('.field-items').find('.field-item').is(':contains("1")') ? 'block' : 'none');
});

http://jsfiddle.net/HackedByChinese/kXdat/1/

答案 4 :(得分:1)

假设每个div.field-item中只有一个div.field-items,这应该可行:

$('.field-items').each(function(i,el)
{
    var field_item = $(el);
    if(field_item.text() == 1)
        $(this).prev().show();
    else
        $(this).prev().hide();
});

示例:http://jsfiddle.net/zsA7W/

答案 5 :(得分:1)

您可以将toggle()与布尔标志

一起使用
$('.field-name-new').each(function() {
    var $this = $(this);
    $this.find('.field-label').toggle(!!$this.find('.field-item').text())
});

如果您有多个each阻止

,我创建了.field-name-new

答案 6 :(得分:1)

一切正常!

$(document).ready(function() {
    if($(".field-item").html() == '0'){    
    $("div.field-label").hide();
    }
});​

更新了Jsfiddle: http://jsfiddle.net/ipsjolly/m4BTd/4/通过更改<div class="field-item">0</div>中的值并点击Run

对其进行测试