无法在html页面上显示返回值

问题描述 投票:0回答:1

我正在编写一个应用程序,它旨在显示基于大量输入的平衡比例的结果,但我似乎无法在HTML页面上显示这些值。

我已经在控制台和codepen.io的控制台上运行它很好但不会在html页面中显示。我也尝试在html标签中调用该函数但没有进展。任何帮助将不胜感激。

这是我的代码

    document.getElementById("submit").onclick = 
function(){
      let result = '';
      let input= document.getElementById("left").value;
      let check = input.split(',');
      if(check.length !== 2){
        result = " Wrong Input, Input can and must be two digits"
      }
      //return;


      let weigh = document.getElementById("weights-array").value;
      let checkWeight= weigh.split(',');
      if(checkWeight.length < 2){
        result = " Wrong Input, Input  must be greater than two digits"
      }
      let arr = [check, checkWeight];
      return;


    function balanceScale(arr){

        //Firstly, we need to convert our strings to numbers we can use in the Array

        let scaleWeights = arr[0].match(/\d+/g).map(Number);

        let weights = arr[1].match(/\d+/g).map(Number);

        let leftSide = scaleWeights[0];

        let rightSide = scaleWeights[1];

        // Secondly, we check for adding weight to one side of the scale i.e leftside or rightside
        for(let i = 0; i < weights.length; i++){
            if(leftSide < rightSide){
                if(leftSide + weights[i] === rightSide){
                  result = weights[i];
                    return result;

                }else if(rightSide + weights[i] === leftSide){
                    result = weights[i];
                    return result;

                }
            }
        }

        //Thirdly, we check for adding weights to both sidess of the scale ie. leftside && rightside
        let i,j;
        for(i = 0; i < weights.length; i++){
            for(j =0; j < weights.length[i]; j++){
                if(leftSide + weights[i] === rightSide + weights[j]){
                  result = weights[i] + ' ' + weights[j];
                  return result;
                }else if(rightSide + weights[i] === leftSide + weights[j]){
                  result = weights[i] + ' ' + weights[j];
                  return result;
                }
            }
        }

        //Lastly we check to add (2) two weights to one side of the scale
        if( leftSide + weights[i] + weights[j] === rightSide){
          result = weights[i] + ' ' + weights[j];
          return result;

        }else if (rightSide + weights[i] + weights[j] === leftSide){
          result = weights[i] + ' ' + weights[j];
          return result;

        }
        // if there are no matching weights
        result = "Scale Imbalanced";
        return result;
      }
      document.getElementById("displayresult").innerHTML = result;

    }
     console.log(balanceScale(["[3, 6]", "[1, 2, 7, 7]"]));



<!-- language: lang-html -->

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title> Scale Balancing</title>
      </head>
      <body>
        <section id = 'head-sect'>
          <h1> Scale Balancing</h1>
        </section>

          <p> Insert an input weight into both sides of the scale.</p>

            <label for= "scaler"> Scale </label>
            <input type = 'text' id ='left' placeholder = 'Type scale Array' required><br><br>

            <label for = "weights"> Weights</weights>
            <input type = "text" id ="weights-array" placeholder = "Type weight Array" required><br><br>
             <button id="submit"> Calculate</button><br><span><br>

          <div id="displayresult">
            <script>
             document.getElementById("displayresult").innerHTML = result;
            </script>
          </div>


      </body>
    </html>

<!-- end snippet -->



      <p> Insert an input weight into both sides of the scale.</p>

        <label for= "scaler"> Scale </label>
        <input type = 'text' id ='left' placeholder = 'Type scale Array'   required><br><br>

        <label for = "weights"> Weights</weights>
        <input type = "text" id ="weights-array" placeholder = "Type weight Array" required><br><br>
         <button id="submit"> Calculate</button><br><span><br>

      <div id="displayresult">
        <script>
         document.getElementById("displayresult").innerHTML = result;
        </script>
      </div>

    and the JS code

document.getElementById("submit").onclick = function(){
  let result = '';
  let input= document.getElementById("left").value;
  let check = input.split(',');
  if(check.length !== 2){
    result = " Wrong Input, Input can and must be two digits"
  }
  //return;


  let weigh = document.getElementById("weights-array").value;
  let checkWeight= weigh.split(',');
  if(checkWeight.length < 2){
    result = " Wrong Input, Input  must be greater than two digits"
  }
  let arr = [check, checkWeight];
  return;


function balanceScale(arr){

    //Firstly, we need to convert our strings to numbers we can use in the Array

    let scaleWeights = arr[0].match(/\d+/g).map(Number);

    let weights = arr[1].match(/\d+/g).map(Number);

    let leftSide = scaleWeights[0];

    let rightSide = scaleWeights[1];

    // Secondly, we check for adding weight to one side of the scale i.e leftside or rightside
    for(let i = 0; i < weights.length; i++){
        if(leftSide < rightSide){
            if(leftSide + weights[i] === rightSide){
              result = weights[i];
                return result;

            }else if(rightSide + weights[i] === leftSide){
                result = weights[i];
                return result;

            }
        }
    }

    //Thirdly, we check for adding weights to both sidess of the scale ie. leftside && rightside
    let i,j;
    for(i = 0; i < weights.length; i++){
        for(j =0; j < weights.length[i]; j++){
            if(leftSide + weights[i] === rightSide + weights[j]){
              result = weights[i] + ' ' + weights[j];
              return result;
            }else if(rightSide + weights[i] === leftSide + weights[j]){
              result = weights[i] + ' ' + weights[j];
              return result;
            }
        }
    }

    //Lastly we check to add (2) two weights to one side of the scale
    if( leftSide + weights[i] + weights[j] === rightSide){
      result = weights[i] + ' ' + weights[j];
      return result;

    }else if (rightSide + weights[i] + weights[j] === leftSide){
      result = weights[i] + ' ' + weights[j];
      return result;

    }
    // if there are no matching weights
    result = "Scale Imbalanced";
    return result;
  }
  document.getElementById("displayresult").innerHTML = result;

}
 console.log(balanceScale(["[3, 6]", "[1, 2, 7, 7]"]));
javascript
1个回答
0
投票

代码中有几个问题。瞥见一些修复。

let scaleWeights = parseFloat(arr[0])
let weights = parseFloat(arr[1]);

if (result == '') {
      document.getElementById("displayresult").innerHTML = balanceScale(arr);
 } else {
      document.getElementById("displayresult").innerHTML = result
 }

附加工作jsfiddle。 https://jsfiddle.net/muneeburrahman/v5x9e4yz/1/

© www.soinside.com 2019 - 2024. All rights reserved.