Javascript 使用函数更改全局变量

我尝试在函数中更改全局声明的变量。在Chrome开发者工具中，我看到变量变为新的值，但是当函数结束并且我稍后使用变量时，值仍然是相同的

下面我添加了我的JavaScript代码。全局变量是

颜色

、

宽度

、

高度

和

半径

。在html中有输入文本字段，用户在其中输入新值，并使用按钮onclick事件触发函数“save”，以更改全局变量，这些变量将在以后使用（用于在画布上绘制）

非常感谢您的帮助！！我真的看不出有什么错误：(

请参阅下文：

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);

---

谢谢你的回答！我已经弄明白了。问题是我在表单标签中有输入文本字段，这需要PHP的操作post/get方法进行进一步处理。这就是变量没有保留更改值的原因。 删除此表单标签后，一切正常

如上所述，当我单击按钮保存值时，将从html文件onclick=“save（）；”调用save（）函数

---

非常感谢您的帮助。

谢谢您的回答！我已经解决了。问题是我在表单标记中有输入文本字段，这需要PHP的action post/get方法进行进一步处理。这就是变量没有保留更改值的原因。 删除此表单标签后，一切正常

如上所述，当我单击按钮保存值时，将从html文件onclick=“save（）；”调用save（）函数

---

非常感谢您的帮助。

尝试调用

window['variableName']

。调用

save（）

？您确定在

drawCircle

和

showPicture

之前调用了

save

？可能会发布完整的代码。此代码看起来不错……save（）没有绑定）函数。在save（）函数中插入一些console.log代码以确保调用它。您可以完全删除save按钮，只需直接从draw函数中使用输入的最新值。尝试调用

窗口['variableName']

。调用

save（）的内容

？是否确定在

drawCircle

和

showPicture

之前调用了

save

？可能会发布完整的代码。此代码看起来正常……目前没有任何按钮绑定save（）函数。请在save（）中粘贴一些console.log代码函数以确保调用它。您可以完全删除“保存”按钮，只需直接使用绘图函数输入的最新值即可。