Question

我正在寻找有关JavaScript的帮助。我们正在尝试计算和显示折扣前价格与折扣后价格之间的百分比差异。相关的类是.from_price和.for_price。价格看起来像这样160,00和130,00。

因此，我们尝试使用此代码，但不起作用：

var price = (Math.round($(".from_price").html())).toString();
var sale = (Math.round($(".for_price").html())).toString();
var korting = (Math.round(((sale - price)/price)*100)).toString();
$("#discount").html("You receive" + korting + "%" + " " + "discount");
}

非常感谢您的帮助！

Answer 1

这是因为您正在使用字符串值来获取折扣值。您可以使用parseFloat()

将160,00转换为160

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="inp-txt">

function getDiscount() {
  var price = parseFloat($(".from_price").html());
  var sale = parseFloat($(".for_price").html());
  console.log(price);
  console.log(sale);
  var korting = (Math.round(((sale - price)/price)*100));
  $("#discount").html("You receive" + korting + "%" + " " + "discount");
}

Answer 2

这里是一个例子：

df_C
Out[66]: 
   A   B   D
0  1  10  25
1  2  60  60
2  3  40  80

var price = +((Math.round($(".from_price").html())).toString());
var sale =  +((Math.round($(".for_price").html())).toString());
var korting = (Math.round(((sale - price)/price)*100)).toString();

$("#discount").html("You receive "+ korting + " %discount");



console.log(typeof sale);

您的问题是您尝试使用字符串进行计算，但效果并不理想。因此，我将您的字符串强制为带有+号和括号的数字。这是一个示例：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="from_price">100</div>
<div class="for_price">50</div>

<div id="discount"></div>

const el = document.getElementById('test').innerHTML;

console.log(el);
console.log(typeof el);

const sumString = el + el;

console.log(sumString); // the string 10 gets added to another string of 10 and thus forms 1010

const sumNr = parseFloat(el) +  +(el);  // now the strings are coered to numbers, both parseFloat and  +(yourvar) coerce strings to nubmers.
console.log(sumNr);

Answer 3

不要将类名用作元素选择器（如果您的文档包含多个具有类.from_price的元素怎么办？）。（数字）值不要依赖innerHTML。使用data-attributes作为定价值，可以完全控制它。我建议使用CSS和数据属性来显示折扣百分比。最后，您实际上并不需要jQuery。

这是一个简单的（荷兰语中的html）代码片段

(() => {
  const price = +document.querySelector("[data-fromprice]").dataset.fromprice;
  const sale = +document.querySelector("[data-forprice]").dataset.forprice;
  const discountPercentage = ((1-(sale/price)) * 100).toFixed(0);
  document.querySelector("[data-discount]").dataset.discount = discountPercentage;
})();

[data-discount]:before {
  content: attr(data-discount)'%';
  color: red;
  font-weight: bold;
}

<p>Van <span data-fromprice="160">€160,00</span></p>
<p>Voor <span data-forprice="130">€130,00</span>!</p>
<p>Uw korting: <span data-discount=""></span></p>

Answer 4

<!Doctype html>
<html>
<body>
    <input id="price">Price
    <br><br>
    <input id="discount">%
    <br><br>
    <button onclick="getPrice()">
Get total
</button>
    <br><br>
    <input readonly id="total">
    <script>
        getPrice = function() {
            var numVal1 = Number(document.getElementById("price").value);
            var numVal2 = Number(document.getElementById("discount").value) / 100;
            var totalValue = numVal1 - (numVal1 * numVal2)
            document.getElementById("total").value = totalValue.toFixed(2);
        }
    </script>
</body>
</html

计算并显示价格类别的折扣百分比Javascript

4 个答案: