我正在为我的大学类(class)创建一个在线票务预订系统,我希望能够在用户点击将票添加到购物车时显示,这会将票的值(value)添加到每个的小计中通过 if 语句点击上限为 3 张票。当我使用 golfTotal 时我可以让它工作,但出于某种原因,当我尝试将它添加到小计时,第一次点击时没有注册,但它在第二次、第三次和第四次点击时有效。
我试过设置它,所以当按钮被点击时它不会通过 if 语句,而只是改变总数并在每次点击时添加它。不确定我还能尝试什么。
<div class="golf">
<p id="golfTotalTickets">0</p>
<p id="golfTotal"></p>
<p><button onclick="golfAdd();" id="golfAdd">Add to Cart</button></p>
</div>
<div class="subtotal">
<div class="subtotal_text">
<h3 id="subtotal">Subtotal: £ <h3 id="total">
0.00</h3></h3><br>
</div>
var total = 0;
var golfTotal = 0;
var golfTotalTickets = 0;
function golfAdd() {
golfTotalTickets += 1;
document.getElementById("total").innerHTML = total.toFixed(2);
if (golfTotalTickets <= 1) {
golfTotal = 15;
total += 15;
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Ticket";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
} else if (golfTotalTickets == 2){
golfTotal += 15
total += 15
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Tickets";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
} else if (golfTotalTickets == 3){
golfTotal += 15
total += 15
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Tickets";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
}else{
window.alert("You are not allowed to buy more than 3 tickets for The Open.");
}
}
单击该按钮时,每次单击时小计的值应增加 15,除非 golfTotalTickets 达到 3,它的上限应为 45。
最佳答案
可以将下面的document.getElementById("total").innerHTML = total.toFixed(2);
移到计算之后。原因是您的计算尚未在您的 if-else
之前完成。
见片段:
var total = 0;
var golfTotal = 0;
var golfTotalTickets = 0;
function golfAdd() {
golfTotalTickets += 1;
//document.getElementById("total").innerHTML = total.toFixed(2); //move from there to after if else
if (golfTotalTickets <= 1) {
golfTotal = 15;
total += 15;
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Ticket";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
} else if (golfTotalTickets == 2){
golfTotal += 15
total += 15
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Tickets";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
} else if (golfTotalTickets == 3){
golfTotal += 15
total += 15
document.getElementById("golfTotalTickets").innerHTML = golfTotalTickets + " Tickets";
document.getElementById("golfTotal").innerHTML = golfTotal.toFixed(2);
}else{
window.alert("You are not allowed to buy more than 3 tickets for The Open.");
}
document.getElementById("total").innerHTML = total.toFixed(2); //here
}
<div class="golf">
<p id="golfTotalTickets">0</p>
<p id="golfTotal"></p>
<p><button onclick="golfAdd();" id="golfAdd">Add to Cart</button></p>
</div>
<div class="subtotal">
<div class="subtotal_text">
<h3 id="subtotal">Subtotal: £ <h3 id="total">
0.00</h3></h3><br>
</div>
关于javascript - 尝试向字符串添加值,并且每次都会不断添加 1,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55436938/