0

I'm developing a coffee shop product website. We have an area where each product has a coffee strength indicator. The database produces a value depending on whether the strength is Strong, Medium, Weak or n/a. The n/a is for non-coffee products.

If n/a is displayed I would like to hide the containing div.

The code I have so far is below. I have some JavaScript that replaces the text displayed by the database with an image for the strength indicator.

If the coffee-strength in the span tag is n/a I would like to hide .

Is this possible???

Thanks in advance.

<div class="coffee-strength">
            <p>Coffee Strength: <span><?php echo $_product->getAttributeText('coffeestrength'); ?></span></p>
</div>



<script type="text/javascript">

            jQuery(function ($) {
                $('.coffee-strength p span').each(function () {
                    var string = $.trim($(this).text());
                    $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />');
                });

            });

</script>
4

4 回答 4

2

这应该有效：

jQuery(function ($) {
    $('.coffee-strength p span').each(function () {
        var string = $.trim($(this).text());

        if (string == "n/a")
            $(this).closest('.coffee-strength').hide();
        else
            $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />');
    });
});
于 2013-11-15T11:08:42.083 回答
0 
            jQuery(function ($) {
            $('.coffee-strength p span').each(function () {
                var string = $.trim($(this).text());
                if(string!="n/a"){
                    $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />');
                }else{
                    $(this).hide();     
                }
                });

        });
于 2013-11-15T11:07:27.023 回答
0

更新脚本：

<script type="text/javascript">

            jQuery(function ($) {
                $('.coffee-strength p span').each(function () {
                    var string = $.trim($(this).text());
                    if(string!="22"){
                        $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />');
                    }else{
                        $(this).closest('.coffee-strength').hide();    
                    }
                    });

            });

            </script>
于 2013-11-15T12:03:41.217 回答
0

你有很多方法可以做到这一点：

HTML 代码：

<div class="coffee-strength">
    <p>Coffee Strength: <span>Strong</span></p>
</div>
<div class="coffee-strength">
    <p>Coffee Strength: <span>Dim</span></p>
</div>
<div class="coffee-strength">
    <p>Coffee Strength: <span>n/a</span></p>
</div>

jQuery代码：

$(function ($) {
    $('.coffee-strength p span').each(function () {
        var string = $.trim($(this).text());
        if (string == 'n/a') {
          $(this).parent().hide();
        }
    });   
});

// or

$(function ($) {   
    $('.coffee-strength p span:contains("n/a")').parent().hide();
});
于 2013-11-15T12:14:35.287 回答