繁体   English   中英

JavaScript DOM 没有响应

[英]JavaScript DOM doesn't respond

我正在尝试制作迷你交付项目。 这是计算运费的页面。 它会计算保险价格和运费,但不会在“总计”部分中汇总。 在输出中,它写下NaN$ ,仅此而已。 我尝试了我所知道的,也使用了互联网但无法解决这个错误。 这里有什么错误? 为什么不总结呢? (不要介意设计)

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <link rel="stylesheet" href="./pricelalc.css">
      <script src="./pricecalc.js"></script>
      <title>Price calculator</title>
      <div class="main">
         <div class="specf">
            <div class="fields">
               enter dimensions(in cms):
               <input type="text" id="width" placeholder="width">
               <input type="text" id="height" placeholder="height">
               <input type="text" id="length" placeholder="length">
            </div>
            <div class="weipri">
               <div class="weight">
                  <label for="weight">Enter weight(in kgs):</label>
                  <input type="text" name="weight" id="weight" placeholder="weight" class="wandp">
               </div>
               <div class="weight">
                  <label for="price">Enter price(USD):</label>
                  <input type="text" name="price" id="price" placeholder="price(USD)" class="wandp">
               </div>
            </div>
            <button onclick="calculate()">Calculate</button>
         </div>
         <div class="summary">
            <div class="sum">
               weight:
               <p id="sumweight">0</p>
               kg
            </div>
            <div class="sum">
               dimensional weight:
               <p id="sumdimweight">0</p>
               kg
            </div>
            <div class="sum">
               <strong>
                  chargeable weight:
                  <p id="sumcharweight">0</p>
                  kg
               </strong>
            </div>
            <hr class="line">
            <br>
            <div class="sum">
               Insurance: 
               <p id="insurance">0</p>
               $
            </div>
            <div class="sum">
               transportation: 
               <p id="transportation">0</p>
               $
            </div>
            <div class="total">
               total: 
               <p id="sum">0</p>
               $
            </div>
         </div>
      </div>
   </head>
   <body>
   </body>
</html>
function calculate() {
    const weight = document.getElementById("weight").value;
    const width = document.getElementById("width").value;
    const height = document.getElementById("height").value;
    const length = document.getElementById("length").value;
    const price = document.getElementById("price").value;

    let sumweight = document.getElementById("sumweight");
    let sumdimweight = document.getElementById("sumdimweight");
    let sumcharwe = document.getElementById("sumcharweight");
    let transportation = document.getElementById("transportation");
    let insurance = document.getElementById("insurance");
    let total = document.getElementById("sum");
    sumweight.innerHTML = weight;
    sumdimweight.innerHTML = length * width * height / 6000;
    if (weight > length * width * height / 6000) {
        sumcharwe.innerHTML = weight;
        transportation.innerHTML = weight * 9;
    }
    if (weight < length * width * height / 6000) {
        sumcharwe.innerHTML = length * width * height / 6000;
        transportation.innerHTML = length * width * height / 6000 * 9;
    }
    insurance.innerHTML = price * 0.1;
    console.log(insurance);

    total.innerHTML = parseInt(insurance) + parseInt(transportation);

}

console.log(document.getElementById("sumcharweight"))
total.innerHTML=parseInt(insurance)+parseInt(transportation);

这条线是问题所在。 保险和运输是 DOM 元素,而不是字符串。 您可能打算在他们的 innerHTML 上调用 parseInt

total.innerHTML=parseInt(insurance.innerHTML)+parseInt(transportation.innerHTML);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM