jquery：检查图像然后应用css

Question

如果relatedProductsArea包含NO图像，则隐藏div。

<div id="RelatedProductsArea" style="border-radius: 7px 7px 7px 7px;"><br clear="all"><div style="clear:both;"></div>
</div>

查找无图像表示没有相关产品。

我尝试了什么：

$('#RelatedProductsArea').has('img').css('border', 'none');

以下是一个例子：http://jsfiddle.net/K2Cp6/

问题：如何在我的jsfiddle示例中隐藏div或删除边框？

Answer 1

尝试

$('#RelatedProductsArea:not(:has(img))').hide()

您需要使用:not()选择器来选择与给定选择器不匹配的元素。在这种情况下，#RelatedProductsArea没有img。

Answer 2

$('#RelatedProductsArea:not(:has(img))').css('border', 'none');

http://jsfiddle.net/Curt/K2Cp6/1/

尝试添加<img />元素并将其移至#RelatedProductsArea进行测试。

  

如果relatedProductsArea包含NO图像，则隐藏div。

如果您想要隐藏div，请使用.hide()代替.css('border', 'none')。

Answer 3

if($('#RelatedProductsArea img').length)) {
  $('#RelatedProductsArea').hide();
}

<强> DEMO

或

$('#RelatedProductsArea').not(':has(img)').hide();

.not() 会过滤div而没有图片。

<强> DEMO

或

$('#RelatedProductsArea').has(':not(img)').css('display', 'none');

<强> DEMO

根据编辑

隐藏使用.hide()或.css('display','none')并删除边框使用.css('border', 'none')。如果你想要两个

.css({
   display: 'none',
   border: 'none'
})

Answer 4

if($('#RelatedProductsArea').find("img").length == 0)
   $('#RelatedProductsArea').css('border', 'none');

Answer 5

解决方案很简单：

$('#RelatedProductsArea').not('img').css('border', 'none');