我编写了一个函数,其中 A 和 B 是 1 到 6 之间的随机数。我希望 A 和 B 的结果显示在计数器中并保存,因此当我再次单击“添加我”按钮时,它会添加以下结果a 和 b 到最后的结果。
因此,如果我单击一次,计数器显示 10。下次单击时,我得到的结果是 8。我希望计数器继续将结果相加。
这是我的代码
<!DOCTYPE html>
<html>
<head>
<title>Javascript Counter</title>
<meta charset="utf-8">
<style type="text/css">
.container {text-align: center; font-size: 20px;}
</style>
</head>
<body>
<div class="container">
<p>The Counter = <span id="Count"> --- </span></p>
<p>A = <span id="a1">?</span></p>
<p>B = <span id="b1">?</span></p>
<input type="submit" value="Add Me" onclick="addTogether()" />
</div>
<script type="text/javascript">
function addTogether(){
var a1 = document.getElementById('a1');
var b1 = document.getElementById('b1');
var count = document.getElementById('Count');
var a = Math.floor(Math.random() * 6 + 1);
var b = Math.floor(Math.random() * 6 + 1);
var y = a + b ;
a1.innerHTML = a;
b1.innerHTML = b;
count.innerHTML = y;
}
</script>
</body>
</html>
最佳答案
如果我理解正确的话。您只需将 count
添加到 y
值即可。
y + (parseInt(count.innerHTML, 10)||0)
如果您想通过刷新保存它,那么您需要保留到本地存储或其他东西。
<!DOCTYPE html>
<html>
<head>
<title>Javascript Counter</title>
<meta charset="utf-8">
<style type="text/css">
.container {text-align: center; font-size: 20px;}
</style>
</head>
<body>
<div class="container">
<p>The Counter = <span id="Count"> --- </span></p>
<p>A = <span id="a1">?</span></p>
<p>B = <span id="b1">?</span></p>
<input type="submit" value="Add Me" onclick="addTogether()" />
</div>
<script type="text/javascript">
function addTogether(){
var a1 = document.getElementById('a1');
var b1 = document.getElementById('b1');
var count = document.getElementById('Count');
var a = Math.floor(Math.random() * 6 + 1);
var b = Math.floor(Math.random() * 6 + 1);
var y = a + b ;
a1.innerHTML = a;
b1.innerHTML = b;
count.innerHTML = y + (parseInt(count.innerHTML, 10)||0);
}
</script>
</body>
</html>
关于javascript - 添加两个值并保存结果以供重复使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47145603/