javascript - 添加两个值并保存结果以供重复使用

标签 javascript

我编写了一个函数,其中 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/

相关文章:

javascript - 提交包含选定选项的表单

javascript - 将函数添加到 $scope 的性能优势?

javascript - 将乘法结果格式化为小数点后两位

javascript - Angular 绑定(bind)字符串日期到输入类型日期

javascript - 在具有自动高度的 IFrame 中获取 Google 表单

javascript - React.js useState 与功能组件上的 Array.push 方法

javascript - Typescript 模块加载错误

javascript - jQuery - 检测点击某个像素区域,然后执行函数

php - 为什么我的返回不起作用?

javascript - 将 JavaScript 变量和 PHP 变量相乘并显示在屏幕上