使用javascript從文本框中獲取價值

這是我的代碼。不知道爲什麼它不工作需要幫助檢查我的代碼。我想從用戶輸入的值中計算平均值和總和。該HTML運作良好，但我的JavaScript代碼是不知何故。請幫助使用javascript從文本框中獲取價值

<script> 
 
    function calc() { 
 
    int a = parseInt(document.getElementsByName("english").value); 
 
    int b = parseInt(document.getElementsByName("bmelayu").value); 
 
    int c = parseInt(document.getElementsByName("math").value); 
 
    int d = parseInt(document.getElementsByName("geo").value); 
 
    int e = parseInt(document.getElementsByName("hist").value); 
 

 
    int sum = a + b + c + d + e; 
 
    int average = (a + b + c + d + e)/5; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
    } < /script>

<html> 
 

 
<head> 
 
    <title>Assignment3</title> 
 
</head> 
 
<script> 
 
    function calc() { 
 
    int a = parseInt(document.getElementsByName("english").value); 
 
    int b = parseInt(document.getElementsByName("bmelayu").value); 
 
    int c = parseInt(document.getElementsByName("math").value); 
 
    int d = parseInt(document.getElementsByName("geo").value); 
 
    int e = parseInt(document.getElementsByName("hist").value); 
 

 
    int sum = a + b + c + d + e; 
 
    int average = (a + b + c + d + e)/5; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
    } 
 
</script> 
 

 
<body> 
 
    <form name="form1"> 
 
    English : 
 
    <input type="number" name="english"> 
 
    <br>Bahasa Melayu : 
 
    <input type="number" name="bmelayu"> 
 
    <br>Math : 
 
    <input type="number" name="math"> 
 
    <br>Geography : 
 
    <input type="number" name="geo"> 
 
    <br>History : 
 
    <input type="number" name="hist"> 
 
    <br> 
 
    <button onclick="calc()">Calculate</button> 
 
    </form> 
 
    <p id="sum"></p> 
 
    <p id="average"></p> 
 
</body> 
 

 
</html>

來源

2015-12-07 Amher25

你以外什麼樣的結果您怎麼弄？ – unicorn2

嘗試在'document.getElementsByName（「english」）'之後添加'[0]''。 –

謝謝，但那不起作用 – Amher25

function calc() { 
 
    var a = parseInt(document.getElementById("english").value); 
 
    var b = parseInt(document.getElementById("bmelayu").value); 
 
    var c = parseInt(document.getElementById("math").value); 
 
    var d = parseInt(document.getElementById("geo").value); 
 
    var e = parseInt(document.getElementById("hist").value); 
 
     console.log(a); 
 
    var sum = a + b + c + d + e; 
 
    var average = (a + b + c + d + e)/5; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
    }

<html> 
 

 
<head> 
 
    <title>Assignment3</title> 
 
</head> 
 
<body> 
 
    English : 
 
    <input type="number" id="english"> 
 
    <br>Bahasa Melayu : 
 
    <input type="number" id="bmelayu"> 
 
    <br>Math : 
 
    <input type="number" id="math"> 
 
    <br>Geography : 
 
    <input type="number" id="geo"> 
 
    <br>History : 
 
    <input type="number" id="hist"> 
 
    <br> 
 
    <button onclick="calc();">Calculate</button> 
 
    <p id="sum"></p> 
 
    <p id="average"></p> 
 
</body> 
 

 
</html>

來源

2015-12-07 07:28:02 Shubham

謝謝！這項工作就像一個魅力。但我不知道「console.log（a）;」是什麼？ – Amher25

我只是檢查值...我忘了刪除它：P – Shubham

哦，我明白了，所以你只需修復getElement的「Name」和「Id」。傻，我，謝謝。 – Amher25

function calc() { 
    var a = parseInt(document.getElementsByName("english")[0].value); 
    var b = parseInt(document.getElementsByName("bmelayu")[0].value); 
    var c = parseInt(document.getElementsByName("math")[0].value); 
    var d = parseInt(document.getElementsByName("geo")[0].value); 
    var e = parseInt(document.getElementsByName("hist")[0].value); 

    var sum = a + b + c + d + e; 
    var average = (a + b + c + d + e)/5; 

    document.getElementById("sum").innerHTML = sum; 
    document.getElementById("average").innerHTML = average; 
}

來源

2015-12-07 07:25:44

它不起作用。不過謝謝 – Amher25

對不起。看來你可以解決這個問題，但你也需要刪除'form'標籤。 –

嘿，我很高興你找到你的答案，但我想，如果你看到一個不同的，可能幫助你方法：

function calc() { 
 
    var elements = Array.prototype.slice.call(document.querySelectorAll(".grade-val")); 
 
    var grades = elements.map(function(element) { 
 
    return element.value; 
 
    }); 
 

 
    var sum = grades.reduce(function(s, c) { 
 
    return parseInt(s, 10) + parseInt(c, 10); 
 
    }); 
 
    var average = sum/grades.length; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
}

<html> 
 

 
<head> 
 
    <title>Assignment3</title> 
 
</head> 
 

 
<body> 
 
    English : 
 
    <input type="number" class="grade-val" name="english"> 
 
    <br>Bahasa Melayu : 
 
    <input type="number" class="grade-val" name="bmelayu"> 
 
    <br>Math : 
 
    <input type="number" class="grade-val" name="math"> 
 
    <br>Geography : 
 
    <input type="number" class="grade-val" name="geo"> 
 
    <br>History : 
 
    <input type="number" class="grade-val" name="hist"> 
 
    <br> 
 
    <button onclick="calc();">Calculate</button> 
 
    <p id="sum"></p> 
 
    <p id="average"></p> 
 
</body> 
 

 
</html>

請注意，我添加了一個類grade-val在每個元素，如果你只是想添加其他受考慮到你沒有修改代碼，但只有標記（插入具有相同類的新元素）。就那麼簡單。

這將在IE8+

來源

2015-12-07 07:49:41

我有固定的工作片段 - 你已經做出了一些錯誤的存在。現在，它的工作原理

function calc() { 
 
    var a = parseInt(document.getElementsByName("english")[0].value); 
 
    var b = parseInt(document.getElementsByName("bmelayu")[0].value); 
 
    var c = parseInt(document.getElementsByName("math")[0].value); 
 
    var d = parseInt(document.getElementsByName("geo")[0].value); 
 
    var e = parseInt(document.getElementsByName("hist")[0].value); 
 

 
    var sum = a + b + c + d + e; 
 
    var average = (a + b + c + d + e)/5; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
    }

<html> 
 

 
<head> 
 
    <title>Assignment3</title> 
 
</head> 
 
<script> 
 
    function calc() { 
 
    int a = parseInt(document.getElementsByName("english")[0].value); 
 
    int b = parseInt(document.getElementsByName("bmelayu")[0].value); 
 
    int c = parseInt(document.getElementsByName("math")[0].value); 
 
    int d = parseInt(document.getElementsByName("geo")[0].value); 
 
    int e = parseInt(document.getElementsByName("hist")[0].value); 
 

 
    int sum = a + b + c + d + e; 
 
    int average = (a + b + c + d + e)/5; 
 

 
    document.getElementById("sum").innerHTML = sum; 
 
    document.getElementById("average").innerHTML = average; 
 
    } 
 
</script> 
 

 
<body> 
 
    <form name="form1"> 
 
    English : 
 
    <input type="number" name="english"> 
 
    <br>Bahasa Melayu : 
 
    <input type="number" name="bmelayu"> 
 
    <br>Math : 
 
    <input type="number" name="math"> 
 
    <br>Geography : 
 
    <input type="number" name="geo"> 
 
    <br>History : 
 
    <input type="number" name="hist"> 
 
    <br> 
 
    <button onclick="calc()">Calculate</button> 
 
    </form> 
 
    <p id="sum"></p> 
 
    <p id="average"></p> 
 
</body> 
 

 
</html>

來源

2015-12-07 07:58:02

使用javascript從文本框中獲取價值

回答

相關問題