javascript - 编写一个可以随意存储和加载数据的点击游戏,但页面刷新后仍然继续点击计数器
问题描述
我是编码新手,今天几天我试图编写一个简单的点击游戏,里面有一个计数器,基本上你所要做的就是点击图片来增加你的 xp 数和 25 xp 数您从中获得 1 次杀戮计数,我已经尝试了 localstorage setitem 并获取项目,它们工作正常但是在我刷新页面然后再次单击图像后,计数器从 1 重置我尝试了一些薄
<html>
<head>
<title> Menggokil Adventure </title>
</head>
<body>
<p>XP: <span id="XP">0</span></p>
<p>KillCount <span id="KillCount">0</span></p>
<img src="gokil.jpg" height="256px" width="256px" onclick="addToXP (1)">
<br>
<button onclick="SAVE()">Save Game Gokil ini</button> <button onclick="LOAD()">Load Game Gokil ini</button>
</body>
</html>
<script>
var XP= 0 , checkXP;
var KillCount=0;
function addToXP(amount) {
XP = XP + (amount)
document.getElementById("XP").innerHTML = XP;
killCount();
}
function SAVE() {
localStorage.setItem("XP", XP); console.log('XP', XP);
localStorage.setItem("killcount", KillCount); console.log("killcount" , KillCount)
}
function LOAD() {
var XP = localStorage.getItem("XP");
var KillCount = localStorage.getItem("killcount");
document.getElementById("XP").innerHTML = XP;
document.getElementById("KillCount").innerHTML = KillCount;
console.log("killcount", KillCount)
}
function killCount() {
if(XP % 25 === 0) {
KillCount++
document.getElementById("KillCount").innerHTML = KillCount;
}
function checkXP() {
var XP = checkXP("XP"); }
if (XP == "checkXP") {
XP = "checkXP"
setCookie("CheckXP", XP);
}
return parseInt(XP);
}
</script>
gs 但是我仍然不知所措,因为我是新手,谁能给我一些解决这个问题的线索?
解决方案
如评论中所述,我将制定答案。
如果您想在您之后使用全局定义的计数器(如XP
or killCount
),LOAD()
那么您必须覆盖变量。如果您从LOAD()
函数中访问它们,这是可能的。您正在做的是在LOAD()
上下文中定义新的局部变量。要覆盖全局定义变量中的值,请var
从变量中省略关键字,XP
并killCount
确保从 localContext 中读取的变量被正确解析为数字。
function LOAD() {
XP = parseInt(localStorage.getItem("XP"));
KillCount = localStorage.getItem("killcount");
document.getElementById("XP").innerHTML = XP;
document.getElementById("KillCount").innerHTML = KillCount;
console.log("killcount", KillCount)
}
这应该让你加快速度。
推荐阅读
- excel - 启用时获取选项按钮和复选框的标题
- go - 是否可以在不同的用户下运行 goroutine 或 go 方法?
- c++ - 优化标志,例如 /O2 = 在文件/项目/或解决方案级别优化?
- javascript - Redux & React:我的 reducer 无法识别带有 setInterval 的操作
- python - Python kivy:如何修复“TypeError:object.__init__() 不带参数”?
- python - 使用 2 核/4 线程运行 mpirun
- sql-server - XML 解析(性能问题)
- python - 将 .py 转换为 .exe 时出现 Pyinstaller 错误
- typescript - 如何使用 typescript-eslint 验证 typescript 文件的 ejs 模板
- node.js - 确定 Javascript (NodeJS) 代码是否在 REPL 中运行