如何使用 jquery 或 javascript 隐藏 div？

Question

您好，如果值为 0.00，我想隐藏一个跨度和一个 div。这是我的代码

<span class="price-old"> <%=getCurrentAttribute('item','custitem_sumisho_listprice')%>      </span>
<span class="price-new"><%=getCurrentAttribute('item','custitem_sumisho_onlineprice')%>  </span>
<div class="save-sale" style="font-size: .8em; padding-top: 4em"><%=getCurrentAttribute('item','custitem_sumisho_totalsave')%></div>

在上面的代码中，如果 class="save-sale" 的 div 将具有 0.00 值，那么我想隐藏 class="price-old" 和 class="save-sale"。这里 getattribute 标签会得到商品价格的价值。

我已经尝试了下面的 jquery，但它不起作用

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
if ($(".save-sale").text() == "0.00") {
$(".save-sale").hide();
$(".price-old").hide();
}
});
</script>

Answer 1

由于您有多个save-sale div，您可以使用.each() 来迭代它们并检查其值以隐藏save-sale 和price-old。

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
  $(".save-sale").each(function(){
  if ($(this).text().trim() == "0.00") {
       $(this).hide();
       $(this).prev(".prod-price").find(".price-old").hide();
    }
  });
});
</script>

DEMO

Answer 2

你可以使用

$(".class or #id").hide()

或类似但使用css样式的东西

$(".class or #id").css('display','none')

但如果你想将其设置为所有具有类的元素，显然使用每个函数：

$(".class").each(函数() { $(this).css('display','none') });

Answer 3

DEMO FIDDLE

试试这个：

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
  $(function () {
    if ($.trim($(".save-sale").text()) == "0.00") {
    $(".save-sale").hide();
    $(".price-old").hide();
  }
});
</script>

对于具有相同类名的多个 div，您可以尝试以下操作：

$(function () {
$(".save-sale").each(function (i) {
    if ($.trim($(this).text()) == "0.00") {
        $(this).closest(".save-sale").hide();
        $(this).closest(".price-old").hide();
    }
     else{
        $(this).closest(".save-sale").show();
        $(this).closest(".price-old").show();
    }
});
});

UPDATED FIDDLE