根据parseInt计算价格

Question

我有两个输入，其中用户输入产品的 width 和 height（假设以毫米为单位）。因此，在 width=50 和 height=20 之前，最低价格为 250 美元。然后，每次将宽度或高度编辑 10 毫米时，我想将总价提高 25 美元。如果 w=60 and h=20（或 w=50/h=30），那么总计应该是 275 美元； 300 美元 - 当 w=60 and h=30...

现在我用我可怜的 jquery 知识创造了这个怪物 https://jsfiddle.net/fkqotzzb/

var basePrice = 250;
var priceForSm = 50;
var price300 = basePrice + priceForSm;
var price450 = price300 + (priceForSm * 3);
var price700 = price450 + (priceForSm * 5);
var price950 = price700 + (priceForSm * 5);

$("#stwidth, #stheight").keyup(function () {

 var stwidth = parseInt($("#stwidth").val(), 10);
 var stheight = parseInt($("#stheight").val(), 10);

 if (stwidth > 113) {
  $("#stwidth").val("113");
 }
  
  if (stheight > 62) {
  $("#stheight").val("62");
 }

 if (stwidth >= 50 && stheight >= 20 || stwidth >= 110 && stheight >= 10) {
  $(".stamp-full-price span").html(basePrice);

 }

 if (stwidth >= 30 && stheight >= 60 || stwidth == 80 && stheight == 20 || stwidth >= 60 && stheight >= 30 || stwidth >= 40 && stheight >= 40) {
  $(".stamp-full-price span").html(price300);
 }

 if (stwidth >= 110 && stheight >= 20 || stwidth >= 110 && stheight == 30 || stwidth >= 70 && stheight >= 30 || stwidth >= 60 && stheight >= 40 || stwidth >= 50 && stheight >= 50 || stwidth >= 40 && stheight >= 60) {
  $(".stamp-full-price span").html(price450);
 }

 if (stwidth >= 110 && stheight >= 40 || stwidth >= 110 && stheight >= 50 || stwidth >= 90 && stheight >= 40 || stwidth >= 80 && stheight >= 50 || stwidth >= 60 && stheight >= 60) {
  $(".stamp-full-price span").html(price700);
 }

 if (stwidth >= 100 && stheight >= 60 || stwidth >= 111 && stheight >= 50) {
  $(".stamp-full-price span").html(price950);
 }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="stwidth" id="stwidth" value="50" class="form-control input-xs" maxlength="3"> x <input type="text" name="stheight" id="stheight" value="20" class="form-control input-xs" maxlength="2"> мм

<div class="stamp-full-price">
  Total: <span>250</span>
</div>

这里的价格和尺寸是手动设置的，但我不想这样设置，最好分别用width和height来控制价格。它也没有涵盖一个案例的所有尺寸，所以我无法预测在特定情况下会显示什么价格，而且它真的很怪物:)。

在单选框和复选框的尺寸之后，我还有一些其他选项。那么如何在定义尺寸后获得总价的价值以添加radio/checkbox的价格？

Answer 1

虽然您已经找到了获得 width/height 的方法，并且希望每增加 10 个就增加 25 美元的价格，只需算一下：

var stwidth = parseInt($("#stwidth").val(), 10);
var stheight = parseInt($("#stheight").val(), 10);

var price = 250;

if(stwidth > 50) {
  price += 25 * Math.ceil((stwidth - 50) / 10)
}

if(stheight > 20) {
  price += 25 * Math.ceil((stheight - 20) / 10)
}

$(".stamp-full-price span").html(price);

当您处于类似情况时，请始终尝试按照您在纸上计算的方式进行数学计算，也许这样会更容易学得更快并完成它。您可以只写下计算某些值的价格的所有步骤，然后用变量替换某些部分。

Answer 2

这是另一种解决方案，其中价格根据四舍五入的值计算

var basePrice = 250;
var baseW = 50;
var baseH = 20;

$("#stwidth, #stheight").keyup(function () {
 var stwidth = parseInt($("#stwidth").val(), 10);
 var stheight = parseInt($("#stheight").val(), 10);

 var dW = (stwidth - baseW) > 0 ? Math.round((stwidth - baseW)/10) : 0;
 var dH = (stheight - baseH) > 0 ? Math.round((stheight - baseH)/10) : 0;
        var price = basePrice + dW*25 +dH*25;
        $(".stamp-full-price span").html(price);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="stwidth" id="stwidth" value="50" class="form-control input-xs" maxlength="3"> x 
<input type="text" name="stheight" id="stheight" value="20" class="form-control input-xs" maxlength="2"> мм

<div class="stamp-full-price">
  Total: <span>250</span>
</div>

根据parseInt计算价格

Calc price based on parseInt

javascript

jquery

parseint