密码锁游戏(JavaScript)

密码锁游戏(JavaScript),第1张

概述我正在做一个谜语游戏,我需要用JavaScript用六位数字制作一个锁组合.我找不到正确组合的方法.我尝试制作6个不同的变量,每个变量有十个可能的数字(从0到9).问题是:当我编写JavaScript时,我使用条件为(n1 == 0&& n2 == 0&& n3 == 0&& n4 == 0&&

我正在做一个谜语游戏,我需要用JavaScript用六位数字制作一个锁组合.我找不到正确组合的方法.我尝试制作6个不同的变量,每个变量有十个可能的数字(从0到9).问题是:当我编写JavaScript时,我使用条件为(n1 == 0&& n2 == 0&& n3 == 0&& n4 == 0&& ; n5 == 0&&n6 == 0)来在所有条件都为真时更改div的ID,但这似乎不起作用.
我看到了一个代码(https://codepen.io/MrHill/pen/kLvcw),它的锁组合与我的相似.编码器将数组与整个组合结合在一起使用,但实际上我对代码并不十分了解,因此我更喜欢使用分离的变量.我必须使用数组还是有办法像现在这样编写if语句?
我应该使用jquery,还是坚持使用Js?

这是我的代码:

var n1 = 1;var n2 = 3;var n3 = 2;var n4 = 1;var n5 = 1;var n6 = 1;document.getElementByID("number1").INNERHTML = n1;document.getElementByID("number2").INNERHTML = n2;document.getElementByID("number3").INNERHTML = n3;document.getElementByID("number4").INNERHTML = n4;document.getElementByID("number5").INNERHTML = n5;document.getElementByID("number6").INNERHTML = n6;function incN1() {    if (n1>9) {        n1 = 0;        document.getElementByID("number1").INNERHTML = n1;    } else {        document.getElementByID("number1").INNERHTML = n1++;    }}function incN2() {    if (n2>9) {        n2 = 0;        document.getElementByID("number2").INNERHTML = n2;    } else {        document.getElementByID("number2").INNERHTML = n2++;    }}function incN3() {    if (n3>9) {        n3 = 0;        document.getElementByID("number3").INNERHTML = n3;    } else {        document.getElementByID("number3").INNERHTML = n3++;    }}function incN4() {    if (n4>9) {        n4 = 0;        document.getElementByID("number4").INNERHTML = n4;    } else {        document.getElementByID("number4").INNERHTML = n4++;    }}function incN5() {    if (n5>9) {        n5 = 0;        document.getElementByID("number5").INNERHTML = n5;    } else {        document.getElementByID("number5").INNERHTML = n5++;    }}function incN6() {    if (n6>9) {        n6 = 0;        document.getElementByID("number6").INNERHTML = n6;    } else {        document.getElementByID("number6").INNERHTML = n6++;    }}function ups() {    alert("It's locked! Try to find the combination to find out what this locker hIDes!");}if (n1==0 && n2==0 && n3==0 && n4==0 && n5==0 && n6==0) {    document.getElementByID('lock').ID = "unlock";}
body {	background-color: black;}#container {	margin: 0 0 0 0;	position: fixed;}#halfCircle {	background-color: black;	border: 24px solID #777;	border-radius: 50%;	wIDth: 200px;	height: 200px;	margin: 100px 0 0 500px;}#lock {	wIDth: 35px;	height: 20px;	background-color: black;	position: fixed;	margin-left: 720px;	margin-top: -140px;	display: none;}#unlock {	wIDth: 35px;	height: 20px;	background-color: black;	position: fixed;	margin-left: 720px;	margin-top: -140px;}#locker {	background-color: #d4af37;	border: 2px solID #404040;	border-radius: 2px;	wIDth: 300px;	height: 300px;	margin: -120px 0 0 473px;}#code {	margin: -190px 0 0 495px;	float: auto;	-moz-user-select: none;	-webkit-user-select: none;	-ms-user-select:none;	user-select:none;	-o-user-select:none;}#number1 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number1:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}#number2 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number2:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}#number3 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number3:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}#number4 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number4:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}#number5 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number5:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}#number6 {	background-color: #777;	margin-left: 1px;	border: 1px solID #404040;	border-radius: 4px;	wIDth: 40px;	height: 80px;	color: #404040;	Font-size: 36px;	Font-family: Roboto Mono;	Font-weight: lighter;	float: left;	padding-top: 20px;}#number6:hover {	background-color: #404040;	color: #000;	Transition-duration: 0.5s;	-webkit-Transition-duration: 0.5s;	-moz-Transition-duration: 0.5s;	-o-Transition-duration: 0.5s;	cursor: pointer;}
<!DOCTYPE HTML><HTML><head>	<Title>13 21 11</Title>	<Meta charset="utf-8">	<link rel="stylesheet" href="@R_403_6822@s://Fonts.GoogleAPIs.com/CSS?family=Roboto Mono"/></head><body>	<div ID="container">		<div onclick="ups()" ID="halfCircle"></div>		<div ID="lock"></div>		<div ID="locker"></div>		<div ID="code">			<div align="center" onclick="incN1()" ID="number1"></div>			<div align="center" onclick="incN2()" ID="number2"></div>			<div align="center" onclick="incN3()" ID="number3"></div>			<div align="center" onclick="incN4()" ID="number4"></div>			<div align="center" onclick="incN5()" ID="number5"></div>			<div align="center" onclick="incN6()" ID="number6"></div>		</div>	</div></body></HTML>

这是我的游戏的链接:

My combination lock

希望你能帮我!

最佳答案您的if语句仅在页面首次加载时运行一次(因此条件显然为false).看起来您想在用户每次增加一个数字时都要检查组合-在这种情况下,将该校验代码放入一个函数中,并在每个函数incN1等内部调用它. 总结

以上是内存溢出为你收集整理的密码锁游戏(JavaScript) 全部内容,希望文章能够帮你解决密码锁游戏(JavaScript) 所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1105390.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-28
下一篇 2022-05-28

发表评论

登录后才能评论

评论列表(0条)

保存