0

我有一个客户需要快速更新，他们使用 woocommerce 并向他们的产品添加评级属性，

当前已设置好，因此您可以选择等级（1-5），并且当前将其输出为段落文本，即<p>1</p>

是否可以使用jquery，以便它用图像替换文本内容，取决于内容，例如，如果内容是“1”，它会用1星的图像替换它，但如果内容是“2 “它会加载带有 2 星等的图像吗？

我试图在不对核心 woocommerce php 进行太多更改的情况下对其进行更新，尽管我已经对其进行了更新，以便该段落所在的表行具有一个类，因此：

<tr class="rating">
<th>rating</th>
<td><p>1</p></td>
</tr>

我假设我使用 jquery 来更改段落的 css 样式，以便它使用相关的星形图像作为段落背景，显示块，并缩进文本以便看不到它，但是有可能这些样式（尤其是背景）取决于段落中的实际文本内容？

非常感谢提前！

4

3 回答 3

0 
$($('#yourTableId tr.rating').each(
    function(){
        var $t = $(this), $p = $t.find('td > p');
        if($p.length){
            $p.addClass($p.text() + 'bg'); // 1bg.jpg ...
            // make sure to create associated classes
        }
    }
));
于 2012-09-14T08:59:28.050 回答
0 
$(document).ready(function(){
$('tr.rating').each(function(){
   $(this).find('p').html('<img src="yourimagesfolder/'+($(this).find('p').text()+'.jpg'" />');
   //make sure to have 1.jpg,2.jpg..etc in your images folder   

    });

});
于 2012-09-14T08:55:50.623 回答
0

是的，你绝对可以拥有这些段落的背景。但是您可以使用其他一些元素，例如 div 并为该 div 设置一些高度和宽度。根据该 div 中的内容，您可以获取背景图像并隐藏内容。

于 2012-09-14T08:56:33.503 回答