-1

我需要创建一段脚本,查看页面上的各种产品,使用“过去”和“现在”价格计算折扣百分比,然后显示该产品的图像,代表折扣百分比。

到目前为止,我可以遍历所有产品并运行百分比脚本以显示图像,但所有产品上都显示相同的图像,而不是不同百分比的不同图像。有谁知道我如何使每个产品的百分比脚本运行而不重复?

这是一些虚拟的 HTML:

<div id="prods">
<div id="discountWasPrice" style="display:none;">50</div>
<div id="discountSellPrice" style="display:none;">25</div>
<div id="discount50"></div>
</div>

<div id="prods">
<div id="discountWasPrice" style="display:none;">75</div>
<div id="discountSellPrice" style="display:none;">25</div>
<div id="discount50"></div>
</div>

<div id="prods">
<div id="discountWasPrice" style="display:none;">10</div>
<div id="discountSellPrice" style="display:none;">8</div>
<div id="discount50"></div>
</div>

这是到目前为止的javascript:

<script type="text/javascript">
var discount = $("div#discount50");
var prods = $("div#prods");
var discountLen = $("div#prods").length;
for(var i = 0; i < discountLen; i++){
var x = $('#discountWasPrice').text();
var f = $('#discountSellPrice').text();
var g = 1-(f/x);
percent= (g * 100).toFixed(2);
if ((percent > 4.00) && (percent < 10.00)) {
    discount[i].innerHTML+="<a href=\"\"><img src=\"5percent.png\"></a>";}
if ((percent > 9.00) && (percent < 15.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"10percent.png\"></a>";}
if ((percent > 14.00) && (percent < 20.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"15percent.png\"></a>";}
if ((percent > 19.00) && (percent < 25.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"20percent.png\"></a>";}
if ((percent > 24.00) && (percent < 30.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"25percent.png\"></a>";}
if ((percent > 29.00) && (percent < 35.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"30percent.png\"></a>";}
if ((percent > 34.00) && (percent < 40.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"35percent.png\"></a>";}
if ((percent > 39.00) && (percent < 45.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"40percent.png\"></a>";}
if ((percent > 44.00) && (percent < 50.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"45percent.png\"></a>";}
if ((percent > 49.00) && (percent < 60.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"50percent.png\"></a>";}
if ((percent > 59.00) && (percent < 70.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"60percent.png\"></a>";}
if ((percent > 69.00) && (percent < 75.00)) {
discount[i].innerHTML+="<a href=\"\"><img src=\"70percent.png\"></a>";}
if (percent > 74.00) {
discount[i].innerHTML+="<a href=\"\"><img src=\"70percentplus.png\"></a>";}
}
</script>

任何帮助深表感谢,

谢谢

4

1 回答 1

1

将每个 div 的“id”移动到“class”,然后让一些 jquery 魔法在所有 div 上循环......

于 2012-06-21T14:03:50.137 回答