时间戳

首页 > 解决方案 > 无法显示总费用

javascript - 无法显示总费用

问题描述

我正在努力计算 totalPrice 和 finalPrice，我已经为此工作了几个小时。我尝试了一切，我应该将 if 和 else 语句放在脚本中吗？什么都试过了，还是不行，我的清除按钮也没有清除。谢谢你的帮助！！！

  <html>
   <head>
    <meta charset = "UTF-8">
        <title> World Travel </title>
        <style>
    body {background-color: black; font-family: optima;
    color: white; text-align: left}
     p { font-size: 20px}
    button {font-size: 20px; background-color: white}
    input { font-size: 20px}
    </style>
    </head>
    <body>
        <script>
     var hotelNights= 0;
      var travelPrice = 0;
     var totalPrice = 0;
     var finalPrice = 0;
     </script>
        <h1> World Travel </h1>
        <h2> Price Processing </h2>
        <p> Select Destination:

            <input type = "radio" id = "a" name = "destination" size = "3"
     onclick = /> Europe

            <input type= "radio" id = "b" name= "destination" size = "3"
      onclick = "destination == 'a';" /> Africa 
        </p>
        <p> Select Air Travel Option:

            <input type = "radio" id = "o" name = "airTravel" size = "3"
    onclick = "
 if (destination == "e") {
      totalPrice += 500; }
      else {
      totalPrice += 700; }
      " /> One Way

            <input type= "radio" id = "x" name = "airTravel" size = "3"
     onclick = "
  if (destination == "e") {
     totalPrice += 900; }
     else {
     totalPrice += 1300; }
     " /> Round Trip 
        </p>
        <p> Enter number of Hotel nights:

            <input type = "text" id = "hotelNights" value = "" 
     onchange = "
  if (destination == "e") {
    totalPrice += 300*document.getElementaryById("hotelNights").value; }
  else {
    totalPrice += 200*document.getElementaryById("hotelNights").value; } " />
        </p>
        <p> Select Tour type:

            <input type = "radio" id = "g" name = "tourPrice" size = "3"
    onclick = "
   if (desination == "e") {
  totalPrice += 1500; }
    else {
  totalPrice + = 1300; } "/> Grand Package

            <input type = "radio" id = "z" name = "tourPrice" size = "3"
   onclick = "
   if (destination == "e") {
    totalPrice += 800; }
   else {
      totalPrice += 500; } " /> Basic Package 
        </p>
        <p>
            <button onclick="


    finalPrice= (totalPrice*1.15);

    totalPriceTextBox.value = '$' + totalPrice.toFixed(2);

    finalPriceTextBox.value = '$' + finalPrice.toFixed(2);

    "> Process </button>
        </p>
        <p> Total Price: $ 
            <input type = "text" id = "totalPriceTextBox" value = "" readonly />
        </p>
        <p> Final Price (includes 15% surcharge): $ 
            <input type = "text" id = "finalPriceTextBox" value = "" readonly />
        </p>
        <p>
            <button onclick= "
          a.checked = false;
          hotelNights = '';
          o.checked = false;
          g.checked = false;
          totalPriceTextBox.value = '';
          finalPriceTextBox.value = '';
          id_of_radio_button.checked = false;
          id_of_text_box = '';
          "> Clear </button>
        </p>
        <body>
        </html>

..................................................... ..................................................... ..................................................... ..................................................... ..................................................... ..................................................... ..................................................... …………………………………………………………………………………………………………………………………………

标签： javascripthtml

解决方案

You can't use double quotes in an inline onclick handler:

     onclick = "
  if (destination == "e") {  // Can't use double quotes here because you're already inside a set of double quotes!
     totalPrice += 900; }
     else {
     totalPrice += 1300; }
     " />

You also need to declare and initialize destination.

Also, this onclick looks wrong:

<input type = "radio" id = "a" name = "destination" size = "3"
     onclick = /> Europe

推荐阅读