使用函數更改全局變量

我嘗試更改函數內全局聲明的變量。在Chrome開發人員工具中，我發現變量會更改爲新值，但是當函數結束並稍後使用變量時，值仍然相同。使用函數更改全局變量

下面我添加了我的JavaScript代碼。全局變量爲color,width,height和radius。在html中有輸入文本字段，用戶輸入新值並通過按鈕onclick-event觸發函數「save」來更改全局變量，稍後使用它（用於在Canvas上繪圖）。

非常感謝您的幫助！我實在看不出這個錯誤:(

請參閱以下內容：！

var c = document.getElementById("myCanvas"); 
var ctx = c.getContext("2d"); 

var color = ""; 
var width = 0; 
var height = 0; 
var radius = 0; 

function save() { 
    color = document.getElementById("color").value; 
    width = document.getElementById("width").value; 
    height = document.getElementById("height").value; 
    radius = document.getElementById("radius").value; 
} 

function drawRectangle() { 
    ctx.fillStyle = color; 
    ctx.fillRect(20,20,width,height); 
} 

function drawCircle() { 
    ctx.beginPath(); 
    ctx.arc(100,100,radius,0,2*Math.PI); 
    ctx.fillStyle = color; 
    ctx.stroke(); 
} 

function showPicture() { 
    var imageObj = new Image(); 

    imageObj.onload = function() { 
     ctx.drawImage(imageObj, 100, 100, 200, 200, 200,200, width, height); 
    }; 

    imageObj.src = 'miami.jpg'; 
} 

var btn1 = document.getElementById("btn1"); 
var btn2 = document.getElementById("btn2"); 
var btn3 = document.getElementById("btn3"); 

btn1.addEventListener("click", drawRectangle, false); 
btn2.addEventListener("click", drawCircle, false); 
btn3.addEventListener("click", showPicture, false);

來源

2016-05-31 Niki

嘗試調用'window ['variableName']'。 –

什麼叫'save（）'？ – Pointy

你確定'save'在'drawCircle'和'showPicture'之前被調用嗎？也許發佈完整的代碼。這段代碼看起來不錯... – Pimmol

謝謝您的回答，我已經想通了，問題是，我在表單的輸入文本字段。標籤，這期望一個動作post/get方法爲PHP進一步處理。這就是爲什麼變量不保留更改的值的原因。刪除此表單標籤後，一切正常。

正如我已經在上面描述save（）函數正在從html-file onclick =「save（）;」被調用，當我點擊按鈕來保存值。

非常感謝您的幫助。

來源

2016-06-02 08:41:12 Niki

使用函數更改全局變量

回答

相關問題