Question

我有一个电子商务网站，其中包含给定商品的多个价格。如果页面上有较低的价格等级，我试图设置一些隐藏价格的脚本。

<table>
    <tbody>
        <tr>
            <td>
                <font>
                    <div class="product_listprice">199.99</div>
                </font>
                <font>
                    <div class="product_productprice">179.99</div>
                </font>
                <b>
                    <div class="product_saleprice">159.99</div>
                </b>
                <font>
                    <div class="product_discountprice">139.99</div>
                </font>
            </td>
        </tr>
    </tbody>
</table>

基本上我需要的是一个脚本，如果.product_saleprice存在于页面上，它将隐藏.product_productprice，如果存在.product_discountprice，则会隐藏.product_saleprice和.product_productprice。

到目前为止，我已经提出了一些google挖掘方法。

<script type="text/javascript">
    $(document).ready(function(){
        if ( $(".product_discountprice").size() )
        $(".product_saleprice, .product_productprice").hide();
        });
    });   
</script>

然而，它似乎并没有起作用。有任何想法吗？我是一个jquery新手，所以我确信有更好的方法可以做到这一点...

Answer 1

// Essentially what I need is a script that will hide .product_productprice
// if .product_saleprice exists on the page...
if ($('.product_saleprice').length) {
    $('.product_productprice').hide();
}

// ...and will hide both .product_saleprice and .product_productprice
// if .product_discountprice exists.
if ($('.product_discountprice').length ) {
    $('.product_saleprice, .product_productprice').hide();
}

更新，添加新的类名，而不是隐藏：

if ($('.product_saleprice').length) {
    $('.product_productprice').addClass('some-class');
}

if ($('.product_discountprice').length ) {
    $('.product_saleprice, .product_productprice').addClass('some-class');
}

Answer 2

http://jsfiddle.net/3481uqa4/1/

  if ($(".product_discountprice").length) {
        $(".product_productprice, .product_saleprice").hide();       
    } else if ($(".product_saleprice").length) {
        $(".product_productprice").hide();
    }

如果product_discountprice存在，将隐藏产品价格和销售价格，否则如果销售价格存在隐藏产品价格。如果它们都不存在，请显示产品价格。

Answer 3

试试这个..不确定它是否正确。

    <script type="text/javascript">
        $(document).ready(function(){
            if($(".product_discountprice").length()){
                $('.product_saleprice').hide();
                $('.product_productprice').hide();
            });
        });   
    </script>

如果元素ID存在，则隐藏其他元素

3 个答案: