我正在编写一个应用，该应用旨在基于多个输入来显示平衡比例尺的结果，但是我似乎无法在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]"]));
答案 0 :(得分：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/