Question

我正在构建购票系统，以使自己的JavaScript变得更好。我需要一些代码的帮助。我可以得到所有想要的东西，但是我无法使我的折扣功能正常工作。

总计的计算方式为（显示价格*门票数量）+（交付方式的价格）

时间：票数> 6的折扣应为总数的10％。时间：门票数量> 10时，折扣应为总数的15％。

折扣应与总额分开显示。

不要介意一些代码，因为我将它们用作参考。

这是代码：

java脚本：

//constants
const name = document.getElementById("fname");
const noofaddress = document.getElementById("noofaddress");
const shows = document.getElementById("shows");
const delivery = document.getElementById("delivery");
const displaytotal = document.getElementById("displaytotal");
const seatprice = document.getElementById("seatprice");
const order = document.getElementById("book");
const showselect = document.querySelector("#shows");

//event listeners
//order.addEventListener("click", gettotal);
//showselect.addEventListener("change", getshowprice);

//amount
var showprices = new Array();
showprices["79"]=79;
showprices["85"]=85;
showprices["67"]=67;
showprices["83"]=83;

function getshowprice() {
const display = document.getElementById("display");

    var showprice = 0;
    var form = document.forms["bookform"];
    var selectedshow = form.elements["shows"]

    showprice = showprices[selectedshow.value];
    return showprice;
}

//event listeners
//order.addEventListener("click", gettotal);
//showselect.addEventListener("change", getshowprice);

//functions

//function calculateshowcost() {
    //showcost = Number(this.value);
    //document.getElementById('display').innerHTML = (`£${bookform.shows[bookform.shows.selectedIndex].value}`);
//}

//delivery funtion
//function getDeliveryValue() {
   // document.getElementById('displaydelivery').innerHTML = (`£${bookform.delivery[bookform.delivery.selectedIndex].value}`);
//}

var deliveryprices = new Array();
deliveryprices["0"]=0;
deliveryprices["1.50"]=1.50;
deliveryprices["3.99"]=3.99;

function getdeliveryprice() {
const displaydelivery = document.getElementById("displaydelivery");
    var deliveryprice = 0;
    var form = document.forms["bookform"];
    var selecteddelivery = form.elements["delivery"]

    deliveryprice = deliveryprices[selecteddelivery.value];
    return deliveryprice;
}


function gettotal() {
const displaytotal = document.getElementById("displaytotal");
const seats = document.getElementById("seats");
const noofseats = document.querySelector("#seats");
    var showtotal = getshowprice()
    var showdeliverytotal = getdeliveryprice()
    var seatstotal = noofseats.value;
    displaytotal.innerText = (`Total: £${(showtotal * seatstotal) + (showdeliverytotal)}`);
}



function getdiscount(products, showtotal, seatstotal) {

const discount = document.getElementById('discount');
  var x = 6

if (seatstotal > x) {



(seatstotal > 10) 
      DiscountPrice = showtotal - (showtotal * .10)


}
else if 
   {
     DiscountPrice = showtotal - (showtotal * .10)
}
return showtotal > y;


  discount.innerText =  (`discount: £${(DiscountPrice)}`);



// total 
//function totalprice(event) {
    //event.preventDefault()
    //showprice = Number(showselect.value);
    //totalnumberoftickets = Number(noofseats.value);
    //totalcost = (showprice * totalnumberoftickets) + deliverycost;
    //displaytotal.innerText = totalTickets;
    //totalPriceResult.innerText = totalPrice;
    //console.log("thank you for your order")
//}

html

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="theatre tickets page for assignment">
    <link rel="stylesheet" href="theatretickets.css">
    <title>Theatre Tickets</title>
</head>

<body class="background">
<script src="theatretickets.js"></script>
    <img class="logoimage" src="" alt="logo">
    <h1 class="title">Theatre Tickets</h1>

<!--navigation -->
    <nav>
        <ul class="a">
            <li class="hp"><a href="fruitmachine.html">Fruit Machine</a></li>
            <li class="hp"><a href="theatretickets.html">Theatre Tickets</a></li>
        </ul><br><br>
    </nav>

<!--forms-->

<!--name-->
    <form name="bookform" id="bookform" class="fullform" method="post">
        <h2>Name</h2>
        <label for="fname">Full Name</label><br>
        <input type="text" id="fname" name="fname" required=""><br>

 <!--address-->
        <h2>Address</h2>
        <label for="noofaddress">Full Address</label><br>
        <input type="text" id="noofaddress" name="noofaddress" required=""><br>

<!--shows-->
        <h2>Currently Available Shows</h2>
        <select name="shows" id="shows" onchange="getshowprice()">
            <option value="79" selected class="Phantom" id="Phantom">Phantom Of The Opera</option>
            <option value="85" class="hamilton" id="hamilton">Hamilton</option>
            <option value="67" class="lionking" id="lionking">Lion King</option>
            <option value="83" class="misssaigon" id="misssaigon">Miss Saigon</option>
        </select><br>
        <label id="display"></label>

<!--delivery-->
        <h2>Method Of Delivery</h2>
        <select id="delivery" name="delivery" onchange="getdeliveryprice()">
            <option id="eticket" value="0" selected>E-Ticket</option>
            <option id="boxoffice" value="1.50">Collect from Box Office</option>
            <option id="posted" value="3.99">Posted</option>
        </select><br>


<!--display the delivery cost label-->
        <label id="displaydelivery"></label>

<!--seats-->
        <h2>Number Of Seats</h2>
        <input type="number" id="seats" name="seats" min="1" required=""
        placeholder="Number of Seats"><br>

        <label id="seatprice"></label><br><br>

<!--book button-->
        <button type="button" name="book" id="book" onclick="gettotal()">Book</button><br><br>
        <div id= "displaytotal"></div>
        <div id="discount"></div>
        <div id="finalcost"></div>
    </form> 
</body>

Answer 1

否。的票证大于10，您仍在应用10％，因此将其替换为15％，我认为您应该先在if-else中检查10的条件，然后再检查6的条件，请参阅新编辑的代码。我不知道这里是什么，所以无法对此发表评论。

//constants
const name = document.getElementById("fname");
const noofaddress = document.getElementById("noofaddress");
const shows = document.getElementById("shows");
const delivery = document.getElementById("delivery");
const displaytotal = document.getElementById("displaytotal");
const seatprice = document.getElementById("seatprice");
const order = document.getElementById("book");
const showselect = document.querySelector("#shows");

//event listeners
//order.addEventListener("click", gettotal);
//showselect.addEventListener("change", getshowprice);

//amount
var showprices = new Array();
showprices["79"]=79;
showprices["85"]=85;
showprices["67"]=67;
showprices["83"]=83;

function getshowprice() {
const display = document.getElementById("display");

    var showprice = 0;
    var form = document.forms["bookform"];
    var selectedshow = form.elements["shows"]

    showprice = showprices[selectedshow.value];
    return showprice;
}

//event listeners
//order.addEventListener("click", gettotal);
//showselect.addEventListener("change", getshowprice);

//functions

//function calculateshowcost() {
    //showcost = Number(this.value);
    //document.getElementById('display').innerHTML = (`£${bookform.shows[bookform.shows.selectedIndex].value}`);
//}

//delivery funtion
//function getDeliveryValue() {
   // document.getElementById('displaydelivery').innerHTML = (`£${bookform.delivery[bookform.delivery.selectedIndex].value}`);
//}

var deliveryprices = new Array();
deliveryprices["0"]=0;
deliveryprices["1.50"]=1.50;
deliveryprices["3.99"]=3.99;

function getdeliveryprice() {
const displaydelivery = document.getElementById("displaydelivery");
    var deliveryprice = 0;
    var form = document.forms["bookform"];
    var selecteddelivery = form.elements["delivery"]

    deliveryprice = deliveryprices[selecteddelivery.value];
    return deliveryprice;
}


function gettotal() {
const displaytotal = document.getElementById("displaytotal");
const seats = document.getElementById("seats");
const noofseats = document.querySelector("#seats");
    var showtotal = getshowprice()
    var showdeliverytotal = getdeliveryprice()
    var seatstotal = noofseats.value;
    displaytotal.innerText = (`Total: £${(showtotal * seatstotal) + (showdeliverytotal)}`);
}



function getdiscount(products, showtotal, seatstotal) {

const discount = document.getElementById('discount');
var x = 10;
var DiscountPrice = 0;

if (seatstotal > x) {
  DiscountPrice = showtotal - (showtotal * .15)
}
else if 

     (seatstotal > 6) 
      DiscountPrice = showtotal - (showtotal * .10)
}
return showtotal > y;


  discount.innerText =  (`discount: £${(DiscountPrice)}`);



// total 
//function totalprice(event) {
    //event.preventDefault()
    //showprice = Number(showselect.value);
    //totalnumberoftickets = Number(noofseats.value);
    //totalcost = (showprice * totalnumberoftickets) + deliverycost;
    //displaytotal.innerText = totalTickets;
    //totalPriceResult.innerText = totalPrice;
    //console.log("thank you for your order")
//}

如何申请折扣

1 个答案: