javascript - 如何使用用户输入创建全局变量？

Question

我正在制作一个程序，我有一个用户输入，用户输入他们的猫的名字，然后我希望名字出现在整个程序的文本中。这是我的代码，它是在 Javascript 中：

var catName = getText("nameInput");
onEvent("startBtn", "click", function(event) {
  setScreen("feedingScreen");
  setText("feedingText", catName+" is hungry! Give "+catName+" some food! 
Click fish to feed.");
});

然而，当我运行这个程序时，猫的名字没有出现在文本中。我怎样才能使它出现在文本显示的地方？

标签： javascript

Answer 1

如果该catName变量要使用很长时间，我会考虑使用localStorage它来存储它并在我想要的时候检索它（即使用户离开页面并返回时）。

例子 ：

function setCatName(name) {
    window.localStorage.setItem('catName', name);
}

function getCatName() {
    return window.localStorage.getItem('catName');
}

但是，如果您不希望这样，可以将其存储在window对象中。请注意，这被认为是不好的做法（但一般来说全局变量也是如此）。

例子 ：

function setCatName(name) {
    window.catName = name;
}

function getCatName() {
    return window.catName;
}

更新 ：

这很有趣，因为 Mozilla 文档上的示例也使用 localStorage 来设置和检索猫的名字：

本地存储文档