Question

我有一个小的HTML网页，其中有很多表格显示各种商品的价格（参见下面的示例）。

{{1}}

问题是我们需要一些方法只需按一下按钮即可以20％的折扣取代所有价格。我试图谷歌不同的选项，但无法弄清楚这里最好的解决方案。

如何创建某种脚本来搜索价格并用“价格x 0.8”替换它们，或者如果有某种方式输入实际价格“40美元”和折扣价“32美元”并且只显示一个当时。

或者是更好的解决方案，只需创建一个额外的重复页面，价格折扣并链接到那个？

此致，亚历山大

Answer 1

以下是否有帮助：

var currentMode = 1;
var discount = 0.20;
var reverseDiscount = 1/(1-discount);

function togglePrices() {
  var prices = document.getElementsByClassName("price");
  for (var i = 0; i < prices.length; i++) {
    var individualPrice = prices[i].innerHTML.substring(1);
    
    if(currentMode == 1) {
      individualPrice = parseFloat(individualPrice) * (1-discount);
    } else {
      individualPrice = parseFloat(individualPrice) * reverseDiscount;
    }

    prices[i].innerHTML = "$" + individualPrice;
  }
  currentMode = (++currentMode) % 2;
}

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <table border="1">
    <tr>
      <td>1</td>
      <td>Item 1</td>
      <td><span class="price" >$40</span></td>
    </tr>
    <tr>
      <td>2</td>
      <td>Item 2</td>
      <td><span class="price" >$20</span></td>
    </tr>
    <tr>
      <td>3</td>
      <td>Item 3</td>
      <td><span class="price" >$50</span></td>
    </tr>
  </table>
</body>


<button type="button" onclick="togglePrices()">Toggle Discounts</button>
</body>
</html>

在网页上更改所有价格（数字）20％

1 个答案: