我想创建一个表单，用户在其中输入值，选中单选按钮，然后单击提交按钮。在以下三种情况下，用户应该通过警报消息得到响应。
情况 1: express 已检查且产品数量 > 50 && < 500
情况 2: express 检查且产品数量不 > 50 && < 500
案例3:标准检查
无论我输入什么值，它都会直接进入情况 2。 情况 1 和情况 3 永远不会达到。
代码片段
<!DOCTYPE html>
<html>
<head>
<title>HTML form</title>
<script>
function calculate() {
var productQuantity = document.getElementById("product-quantity").value +
" Units";
var express = document.getElementById("express");
var standard = document.getElementById("standard");
// EXPRESSED ------------------------------
if (express.checked) {
if ((productQuantity > 50) && (productQuantity < 500)) {
// CASE 1
alert("your order of " + productQuantity +
" will be ready within two working day");
} else {
// CASE 2
alert("sorry! your order is " + productQuantity +
" and it has to be over 50 in order to qualify for this service"
);
}
}
// STANDARD ------------------------------
else if (standard.checked) {
// CASE 3
alert("your order of " + productQuantity +
" will be ready within seven working day");
}
}
</script>
</head>
<body>
<div class="container">
<div class="row" style="padding-top:20px">
<div class="col-md-6">
<div class="input-group">
<label for="product-quantity">Please Enter number of units
for this product:</label> <input class="form-control" id=
"product-quantity" placeholder="Product Quantity" type=
"number">
</div>
</div>
</div>
<div id="product-time" style="padding-top:20px">
<label for="title">Production Time</label>
<div class="row">
<div class="col-md-3 col-sm-6">
<input id="express" name="radio" type="radio"> <label for=
"productionTime">Express</label>
</div>
<div class="col-md-3 col-sm-6">
<input id="standard" name="radio" type="radio"> <label for=
"productionTime">Standard</label>
</div>
</div>
</div><span class="input-group-btn" style=
"padding-top:25px"><button class="btn btn-default" id="button" onclick=
"calculate()" type="button"><span class="input-group-btn" style=
"padding-top:25px">Submit!</span></button></span>
</div>
</body>
</html>最佳答案
productQuantity 是一个字符串，将其与 if 语句中的整数进行比较将始终为 false。我建议在 if 语句之前将其转换为整数，然后将其转换回字符串并添加“单位”部分。
var productQuantity = document.getElementById("product-quantity").value
var productQuantityInt = parseInt(productQuantity, 10);
if (productQuantityInt > 50 && productQuantityInt < 500){...};
productQuantity += ' Units';
希望有帮助
编辑(哎呀):
由于productQuantity输入字段设置为“数字”类型，因此您不需要我的大量代码。这应该有效:
var productQuantity = document.getElementById("product-quantity").value
if (productQuantity > 50 && productQuantity < 500){...};
productQuantity += ' Units';
关于javascript - 带有分支条件的 HTML 表单不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37421931/