Javascript - 无法获取函数来设置要在函数外部使用的全局变量
Javascript - Cannot get function to set global variable to be used outside function
我正在尝试制作一个简单的线性文本游戏,该游戏将显示在网页上的div内。我正在使用 innerHTML 将游戏的内容写入div,并使用按钮的 onclick 来更改内容。我的问题是我还想包含一些用户提交的变量,我正在尝试在函数中使用 prompt() 执行此操作。
问题是,我无法全局设置变量。它在函数内部调用时有效,但在其他地方不起作用。
我尝试首先在函数外部声明变量,使用 window.variable(函数内部和外部),并在函数内的变量之前保留var
以使其在范围内全局。
我一直在寻找解决方案,但似乎没有任何效果!我的脚本顺序是否遗漏了某些内容?
这是javascript:
var cb2 = '<input id="button" type="button" value="Continue" onclick="replace(''gamebox'',next3,''continueBttn'',cb3);">';
var cb3 = '<input id="button" type="button" value="Continue" onclick="getName();">';
var cb4 = '<input id="button" type="button" value="Continue" onclick="replace(''gamebox'',next5,''continueBttn'',cb5);">';
var cb5 = '<input id="button" type="button" value="Continue" onclick="replace(''gamebox'',next6,''continueBttn'',cb6);">';
var testName = "Test Name";
var player1;
var next2 = "<p>Great, you've certainly got an adventurer's spirit! Now I just need a few details about you and your party.</p>";
var next3 = "<p>First, I'd like to get everyone's name</p>"
var next4 = "<p>Thanks " + testName + "!</p>"
var next5 = "<p>Now you're ready " + player1 + "! Click to set out on the trail!</p>"
var continueButton = function (content) {
document.getElementById('continueBttn').innerHTML = content;
};
function replace(id1,content,id2,cb) {
document.getElementById(id1).innerHTML = content;
document.getElementById(id2).innerHTML = cb;
}
function getName() {
player1 = prompt("What is your Name?");
alert("Your name is " + player1 + ".");
replace('gamebox',next4,'continueBttn',cb4);
}
这是 html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="oregon.css" />
</head>
<body>
<div id="gameContainer">
<div id="gamebox">
<p>Welcome to the Oregon Trail! Click Continue to travel the trail!</p>
</div>
</div>
<div id="continueBttn"><input id="button" type="button" value="Continue" onclick="replace('gamebox',next2,'continueBttn',cb2);"></div>
</body>
</html>
<script src="oregon.js" type="text/javascript"></script>
好的,我让你的东西工作了。 去除变量的var
,使它们成为全局变量,并将函数更改为分配给变量,如 continueButton
:
replace = function(id1, content, id2, cb) {
document.getElementById(id1).innerHTML = content;
document.getElementById(id2).innerHTML = cb;
}
getName = function() {
player1 = prompt("What is your Name?");
alert("Your name is " + player1 + ".");
replace('gamebox', next4, 'continueBttn', cb4);
}
这让事情对我有用。
这里的其他答案也有优点,您需要一种更好的方法来处理玩家名称。
player1
用于表达式 next5
,而不是 next4
(这是您的getName()
函数之一)
无论如何,它永远不会像这样工作。在初始化next5
,player1
的值以某种方式定义,并且将保持这种方式定义,除非您再次重新定义next5
变量。
您需要将next5
定义封装到函数中,以使其动态化。
问题就在这里
var next5 = "<p>Now you're ready " + player1 + "! Click to set out on the trail!</p>"
它在首次呈现时使用该变量,当您将player1
设置为新值时,它不会更新。
您需要找出一种不同的方法来设置玩家的名称。一种方法是更换它。
var next5 = "<p>Now you're ready {player1}! Click to set out on the trail!</p>"
当你使用它时
var newStr = next5.replace("{player1}", player1);
相关文章:
- 访问函数外部的变量
- appendChild在函数外部工作,但在函数内部不工作
- 使用在函数外部声明的变量的 Javascript 返回值 + undefined
- JavaScript未定义的函数外部JavaScript文件
- 没有在函数外部分配全局变量
- 在挖空中引用对象构造函数外部视图模型的属性
- 访问函数外部的变量
- JS:从函数外部调用变量
- 在函数外部的 Angularjs 中访问 $http.get 的结果
- JQuery 更改函数外部的变量值
- 函数外部的 clearTimeout() 无法正常工作
- Javascript - 无法获取函数来设置要在函数外部使用的全局变量
- 如何设置 var self = this;从函数外部
- 在 JavaScript 中维护函数外部变量的值
- 为什么匿名函数中的私有变量可以从 javascript 中的函数外部访问
- 如何在函数外部获取变量的值
- 如何在函数外部访问 Javascript 变量值
- 节点.js在函数外部获取 MySQL 的结果
- 如何使用 $http.get 每 3 秒发出一个新请求并在函数外部获取数据
- 在 Phonegap DB 函数中返回函数外部的变量