使用函数更改全局变量

我尝试更改函数内全局声明的变量。在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

使用函数更改全局变量

回答

相关问题