當我單擊按鈕“ =”時，沒有任何反應

Question

我試圖用javascript做一個簡單的計算器，但是當我單擊按鈕'='時，結果沒有出現。

    <!DOCTYPE html>
<html>
    <body>
        <h1> Kalkulator Sederhana</h1>
            <input type="text" name="angkapertama" placeholder="Angka Pertama" id="angkapertama">
            <input type="text" name="angkakedua" placeholder="Angka Kedua" id="angkakedua">
        <button id="hasil" onclick="tambah">=</button>

        <h2 id="hsl"></h2>

        <script>
            var a = document.getElementById('angkapertama').value;
            var b = document.getElementById('angkakedua').value;
            var c = document.getElementById('hasil');
            c.addEventListener('click', tambah, false);

            function tambah() {
                return a + b;
                document.getElementById("hsl").innerHTML = tambah; 
            }
        </script>
    </body>
</html>

Answer 1

與此有關的許多問題

1）在用戶有機會在文本框中鍵入任何內容之前，先從文本框中收集輸入值。 您需要在事件處理程序中執行此操作。

2）內聯事件屬性（無論如何都沒有正確地定義() ）和在代碼中添加了事件監聽器。 只需要一個。 通常認為eventListener是更好的方法，例如，出於代碼可維護性和可見性的考慮。

3）將值視為字符串而不是數字（例如，如果代碼正常運行，則“ 4” +“ 4”將返回“ 44”！）

4）從您的tambah（）函數返回實際顯示結果的行之前。 return從函數返回，不僅是為了獲取計算結果。

此版本糾正了所有這些錯誤。 您可以運行它進行測試：

 var c = document.getElementById('hasil'); c.addEventListener('click', tambah, false); function tambah() { var a = document.getElementById('angkapertama').value; var b = document.getElementById('angkakedua').value; var sum = parseFloat(a) + parseFloat(b); document.getElementById("hsl").innerHTML = sum; }

 <h1> Kalkulator Sederhana</h1> <input type="text" name="angkapertama" placeholder="Angka Pertama" id="angkapertama"> <input type="text" name="angkakedua" placeholder="Angka Kedua" id="angkakedua"> <button id="hasil">=</button> <h2 id="hsl"></h2>

Answer 2

一個簡單的例子

 var c = document.getElementById('hasil'); c.addEventListener('click', tambah, false); function tambah() { var a = document.getElementById('angkapertama').value; var b = document.getElementById('angkakedua').value; var sum = Number(a) + Number(b); //or // var sum = parseFloat(a) + parseFloat(b); document.getElementById("hsl").innerHTML = sum; console.log(sum) }

 <h1> Kalkulator Sederhana</h1> <input type="text" name="angkapertama" placeholder="Angka Pertama" id="angkapertama"> <input type="text" name="angkakedua" placeholder="Angka Kedua" id="angkakedua"> <button id="hasil">=</button> <h2 id="hsl"></h2>

但是，盡管是標准功能，但addEventListener（）函數在舊版本的瀏覽器（版本9以下的Internet Explorer）中無法使用，這是另一個很大的不同。 如果需要支持這些古老的瀏覽器，則應遵循onclick方式。

HTML：

<button id="hasil" onclick="tambah()">=</button>

腳本：

function tambah() {
    var a = document.getElementById('angkapertama').value;
    var b = document.getElementById('angkakedua').value;

    var sum = Number(a) + Number(b); //or
    // var sum = parseFloat(a) + parseFloat(b);
    document.getElementById("hsl").innerHTML = sum;
    console.log(sum)
 }

內容來源在這里

Answer 3

您的代碼有些錯誤。

當您返回a + b時，在該return語句之后不會執行任何代碼。

我已經稍微更改了代碼，現在在函數內定義了變量a和b，並且還確保在a和b上使用parseInt否則它們最終將被串聯為字符串（這意味着1 + 2為12 -錯誤！）

 var c = document.getElementById('hasil'); c.addEventListener('click', tambah); function tambah() { var a = parseInt(document.getElementById('angkapertama').value); var b = parseInt(document.getElementById('angkakedua').value); var result = a + b; document.getElementById("hsl").innerHTML = result; }

  <!DOCTYPE html> <html> <body> <h1> Kalkulator Sederhana</h1> <input type="text" name="angkapertama" placeholder="Angka Pertama" id="angkapertama"> <input type="text" name="angkakedua" placeholder="Angka Kedua" id="angkakedua"> <button id="hasil">=</button> <h2 id="hsl">answer here</h2> </body> </html>

Answer 4

嘗試這個：

 <!DOCTYPE html>
    <html>
        <body>
            <h1> Kalkulator Sederhana</h1>
                <input type="text" name="angkapertama" placeholder="Angka Pertama" id="angkapertama">
                <input type="text" name="angkakedua" placeholder="Angka Kedua" id="angkakedua">
            <button id="hasil" onclick="tambah()">=</button>

            <h2 id="hsl"></h2>

            <script>
                var a = document.getElementById('angkapertama').value;
                var b = document.getElementById('angkakedua').value;
                var c = document.getElementById('hasil');
                c.addEventListener('click', tambah, false);

                function tambah() {
                    var sum = a + b;
                    document.getElementById("hsl").innerHTML = sum; 
                }
            </script>
        </body>
    </html>

當我單擊按鈕“ =”時，沒有任何反應

問題描述

4 個解決方案

解決方案1
2 2017-09-20 14:35:32

解決方案2
1 2017-09-20 14:27:21

解決方案3
1 2017-09-20 14:31:03

解決方案4
-1 2017-09-20 14:25:49

當我單擊按鈕“ =”時，沒有任何反應

問題描述

4 個解決方案

解決方案1 2 2017-09-20 14:35:32

解決方案2 1 2017-09-20 14:27:21

解決方案3 1 2017-09-20 14:31:03

解決方案4 -1 2017-09-20 14:25:49

解決方案1
2 2017-09-20 14:35:32

解決方案2
1 2017-09-20 14:27:21

解決方案3
1 2017-09-20 14:31:03

解決方案4
-1 2017-09-20 14:25:49