根据属性值隐藏元素 jquery

Question

如何根据父 div 的 attribute 值隐藏子 div。我有以下标记：

<div class="offerContainer">
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"></div>
    </div>
    <div class="Offers" producttype="P">
        <div class="buttons_wrap"></div>
    </div>
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"></div>
    </div>
</div>

我只想在 producttype 的属性值为 "CIP" 时隐藏 buttons_wrap。

类似于：

if($(obj).parents(".offersContainer").find('.Offers').attr('producttype').value == "CIP")
    $('.buttons_wrap').hide();

Answer 1

$('.buttons_wrap').each(function(){
    if($(this).parents('.Offers').attr('producttype') == "CIP"){
        $(this).hide();
    }
});

JSFIDDLE 示例：

https://jsfiddle.net/Panomosh/kL11m73L/

Answer 2

试试这个自定义方法

$(function() {
var $offers = $('.Offers');
$offers.each(function() {
var productType = $(this).attr('producttype');
if(productType != "CIP")
{ 
   $(this).children().hide();
}
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div class="offerContainer">
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"><button>First</button></div>
    </div>
    <div class="Offers" producttype="P">
        <div class="buttons_wrap"><button>Second</button></div>
    </div>
    <div class="Offers" producttype="CIP">
        <div class="buttons_wrap"><button>Third</button></div>
    </div>
</div>

根据属性值隐藏元素 jquery

Hide element based on attribute value jquery

jquery

attributes

hide

试试这个自定义方法