JavaScript定義變量外功能

我想做一個變量，我可以不斷添加一個數字與HTML <input type="number">。
我希望變量通過點擊一個按鈕來改變輸入的值。通過再次點擊按鈕，我希望變量將第二個輸入添加到先前更改的數字。
用下面的代碼我得到任何輸入值NaN的消息，因爲var num是undifined：JavaScript定義變量外功能

<body> 
     <span id="number"></span> 
     <input id="addnum" type="number" style="width:60px; height:20px;"> 
     <button onclick='add()'>Add</button> 

    <script> 
     var num = 0; 

     window.onload = function numstart() { 
      document.getElementById('number').innerHTML = num; 
     } 

     function add() { 
      var addnum = parseInt(document.getElementById("addnum").value); 
      var num = num + addnum; 
      document.getElementById('number').innerHTML = num; 
     } 
    </script> 
</body>

但是，如果我做定義功能var num = 0;數量每個I調用函數時重置。如何在函數中定義變量num而不調用它的值時調用它？

來源

2014-12-02 Thijs

刪除函數中的「var」; 「var」這個詞基本上意味着「創造一個新變量」，這顯然不是你想要的。 – Erik 2014-12-02 10:53:35

您重置num在add()功能，它並沒有太大的意義：

var num = num+addnum;

的意思是「做一個新的變量num，其值是NUM + addnum，別急，你剛纔定義num，so ...「

你想引用全局變量。試試這個：

num += addnum;

或

num = num+addnum;

來源

2014-12-02 10:54:46 deitch

它工作:)謝謝！需要重新回到它... – Thijs 2014-12-02 11:01:16

優秀。祝你好運。 – deitch 2014-12-02 11:14:07

你可以做這樣的事情

<body> 
    <span id="number"></span> 
    <input id="addnum" type="number" style="width:60px; height:20px;"> 
    <button onclick='add()'>Add</button> 

<script> 
    var num = 0; 

    window.onload = function numstart() { 
     document.getElementById('number').innerHTML = num; 
    } 

    function add() { 
     var addnum = parseInt(document.getElementById("addnum").value); 
     num = num + addNum; 
     document.getElementById('number').innerHTML = num; 
    } 
</script>

來源

2014-12-02 10:56:16

有棘手的事情hoisting發生其迷惑你。您的代碼是相同的：

function add() { 
    var addnum = parseInt(document.getElementById("addnum").value); 
    var num; 

    num = num + addnum; 
    document.getElementById('number').innerHTML = num; 
}

爲什麼num的功能塊中未定義，num的已宣告但尚未定義所以它的undefined和屬地申報陰影外num現在很明顯。所以你當然會得到NaN。

該修復很簡單，只需刪除var關鍵字直接與外部範圍num工作。

來源

2014-12-02 10:56:30 dfsq

試試這個：

<html> 
<head> 
<script>  
     function add() {     
      document.getElementById('number').innerHTML = parseInt(document.getElementById('number').innerHTML)+1; 
     } 
    </script> 
</head> 
<body> 
     <span id="number"></span> 
     <input id="addnum" type="number" style="width:60px; height:20px;"> 
     <button onclick='add()'>Add</button>  
</body> 
</html>

因爲每次你點擊你有這個問題，你的函數開始從頭再來然後完成，並釋放其分配的內存空間。

來源

2014-12-02 10:56:56

JavaScript定義變量外功能

回答

相關問題