Question

我有两个输入，其中产品的用户类型width和height（以mm表示）。因此，在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/

＆＃13;

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);
	}
});

＆＃13;

<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>

＆＃13;

此处手动设置了价格和尺寸，但我不想设置它们，最好分别按width和height控制价格。它也没有覆盖所有尺寸的情况，所以我不能预测在特定情况下可以显示什么价格，而且它真的是怪物:)。

在无线电和复选框形式的尺寸后，我还有其他选择。那么如何在定义尺寸以增加收音机/复选框的价格后获得总价格的价值呢？

Answer 1

虽然你已经找到了获得宽度/高度的方法，并希望每增加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

2 个答案: