gpt4 book ai didi

javascript - 尝试以列表格式设置和检索本地存储变量

转载 作者:行者123 更新时间:2023-12-02 13:50:21 25 4
gpt4 key购买 nike

此代码的目的是检索一组随机数字以及关联的帧编号,并将它们传递到本地存储,检索后,它们将被设置在“帧编号”框中​​的另一个位置

function myFunction() {
var x = Math.floor((Math.random() * 10) + 1);
document.getElementById("Pins").innerHTML = x;
}
var clicks = 0;
function onClick() {
clicks += 1;
if (clicks > 10) {
clicks = 0;
}
document.getElementById("clicks").innerHTML = clicks;
};
if (typeof (Storage) !== "undefined") {
if (('#clicks') == 1) {
(localStorage.setItem("#frame1", "#clicks"))
document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1");
}
}
else if (('#clicks') == 2) {
(localStorage.setItem("#frame2", "#clicks"))
document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2");
}
.framebox {
border: 1px dashed black;
}
    
<button onclick="myFunction(), onClick()">Roll</button>
<div class="row">
<div class="col-xs-12">
Pins Hit:
</div>
<p id="Pins"></p>
<div class="col-xs-12"> Frame Number</div>
<div id="clicks"></div>
<br />
<h5 class="text-center">Frames</h5>
<ul>
<li class="framebox col-xs-1" id="frame1" name="Frame 1"></li>
<li class="framebox col-xs-1" id="frame2" name="Frame 2"></li>
<li class="framebox col-xs-1" id="frame3" name="Frame 3"></li>
<li class="framebox col-xs-1" id="frame4" name="Frame 4"></li>
<li class="framebox col-xs-1" id="frame5" name="Frame 5"></li>
<li class="framebox col-xs-1" id="frame6" name="Frame 6"></li>
<li class="framebox col-xs-1" id="frame7" name="Frame 7"></li>
<li class="framebox col-xs-1" id="frame8" name="Frame 8"></li>
<li class="framebox col-xs-1" id="frame9" name="Frame 9"></li>
<li class="framebox col-xs-1" id="frame10" name="Frame 10"></li>
</ul>
</div>


我无法让帧返回正确的数字和分数,感谢任何帮助

最佳答案

   <!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<style>
.framebox {
border: 1px dashed black;
}
</style>


<button onclick="myFunction();onClick()">Roll</button>
<div class="row">
<div class="col-xs-12">
Pins Hit:
</div>
<p id="Pins"></p>
<div class="col-xs-12"> Frame Number</div>
<div id="clicks"></div>
<br />
<h5 class="text-center">Frames</h5>
<ul>
<li class="framebox col-xs-1" id="frame1" name="Frame 1"></li>
<li class="framebox col-xs-1" id="frame2" name="Frame 2"></li>
<li class="framebox col-xs-1" id="frame3" name="Frame 3"></li>
<li class="framebox col-xs-1" id="frame4" name="Frame 4"></li>
<li class="framebox col-xs-1" id="frame5" name="Frame 5"></li>
<li class="framebox col-xs-1" id="frame6" name="Frame 6"></li>
<li class="framebox col-xs-1" id="frame7" name="Frame 7"></li>
<li class="framebox col-xs-1" id="frame8" name="Frame 8"></li>
<li class="framebox col-xs-1" id="frame9" name="Frame 9"></li>
<li class="framebox col-xs-1" id="frame10" name="Frame 10"></li>
</ul>
</div>






<script>

function myFunction() {
var x = Math.floor((Math.random() * 10) + 1);
document.getElementById("Pins").innerHTML = x;
}
var clicks = 0;
function onClick() {
clicks += 1;
if (clicks > 10) {
clicks = 0;
}
document.getElementById("clicks").innerHTML = clicks;

if (typeof (Storage) !== "undefined") {
if ((clicks) == 1) {
(localStorage.setItem("#frame1", clicks))
document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1");
}

else if (clicks == 2) {
(localStorage.setItem("#frame2", clicks))
document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2");
}
}
}
</script>
</body>
</html>

尝试上面的代码给出输出

关于javascript - 尝试以列表格式设置和检索本地存储变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41033493/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com