我正在尝试开发一个计算折扣价格并显示在网页上的网页。最主要的是用相同的onclick事件触发这两个函数,但它不会运行,就我而言,我不知道这些函数是写错了还是其他东西。我需要在一个ID =“折扣”中显示折扣百分比,并在另一个ID =“结果”中显示折扣价格。无法弄清楚我在哪里搞砸,任何帮助将不胜感激。JavaScript不会运行
function calculate() {
var product_name = document.getElementById('name').value;
var product_price = document.getElementById('price').value;
var select = document.getElementById("sale");
var selected = select.options[select.selectedIndex].value;
if (selected == summer) {
var discount_price = product_price - (product_price * 0.10);
} else if (selected == newyear) {
var discount_price = product_price - (product_price * 0.05);
} else {
var discount_price = product_price - (product_price * 0.15);
}
// body...
}
function display_sale() {
if (selected == summer) {
document.getElementById('discount').innerHTML = "The discount is 10%";
} else if (selected == newyear) {
document.getElementById('discount').innerHTML = "The discount is 5%";
} else {
document.getElementById('discount').innerHTML = "The discount is 15%";
}
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="container">
<form>
<h1>DISCOUNT PRICE</h1>
<table>
<tr>
<td>Product Name</td>
<td colspan="2"><input type="text" name="name" id="name" pattern="[a-zA-Z\s]+" required="required"></td>
</tr>
<tr>
<td>Product Price</td>
<td colspan="2"><input type="text" name="price" id="price" pattern="([1-9][0-9]*(\.[0-9]*[1-9])?|0\.[0-9]*[1-9])" required="required"></td>
</tr>
<tr>
<td>Season</td>
<td colspan="2"><select id="sale">
<option value="summer">SUMMER SALE</option>
<option value="newyear">NEW YEAR SALE</option>
<option value="clearance">CLEARANCE SALE</option>
</select>
</td>
</tr>
</table><br/>
<div style="margin-left: 40%">
<button type="submit" onclick="calculate();"> GET DISCOUNT PRICE</button>
</div>
<div id="discount">
</div>
<div id="result">
</div>
</div>
</form>
</body>
</html>
单击按钮,检查开发者工具控制台 - 看到错误'的ReferenceError:选择不defined' - 那是因为你使用了一个没有定义的变量'selected'。提示:'夏天'和'新年'也没有定义 –
我已经在脚本中定义它,不会那么工作?如果我使用var定义,或者我应该把值放在“”内? –
也许在'calculate'中,但不是'display_sale',而不是在'display_sale'中,而不是'claculate'中的定义在display_sale中不可用 –