我试图做一个点击者游戏,当点击次数达到一定数量时,会发生一些事情。什么都没发生。任何想法,为什么我添加的if语句在达到10次点击次数时不做任何事情?如果声明为自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Clicker</title>
<script src="counter.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/css/bootstrap.min.css" integrity="2hfp1SzUoho7/TsGGGDaFdsuuDL0LX2hnUp6VkX3CUQ2K4K+xjboZdsXyp4oUHZj" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js" integrity="sha384-THPy051/pYDQGanwU6poAc/hOdQxjnOEXzbT+OuUAFqNqFjL+4IGLBgCJC3ZOShY" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js" integrity="sha384-Plbmg8JY28KFelvJVai01l8WyZzrYWG825m+cZ0eDDS1f7d/js6ikvy1+X+guPIB" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/js/bootstrap.min.js" integrity="VjEeINv9OSwtWFLAtmc4JCtEJXXBub00gtSnszmspDLCtC0I4z4nqz7rEFbIZLLU" crossorigin="anonymous"></script>
<style>
body{
text-align: center;
background-image: url("https://gift-frog.com/wp-content/uploads/2016/06/off-white-textured-background-1920x10803.jpg");
}
h1{
font-size: 100px;
color: #372424;
}
h3{
color: #372424;
}
h2{
color: #372424;
}
*.unselectable {
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
/*
Introduced in IE 10.
See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
*/
-ms-user-select: none;
user-select: none;
}
</style>
</head>
<body id="body" onclick="doClick()">
<nav class="navbar navbar-dark navbar-inverse">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar" aria-controls="exCollapsingNavbar" aria-expanded="false" aria-label="Toggle navigation">
☰
</button>
<div class="collapse" id="exCollapsingNavbar">
<div class="bg-inverse p-a-1">
<h4>Your Statistics</h4>
<span class="text-muted">graph in development</span>
<br>
<h4>Rank</h4>
<progress class="progress progress-success" value="bob" max="500"></progress>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<h1 class="unselectable">Clicked <h1 class="unselectable" id="counter">0</h1></h1> <h1 class="unselectable">times</h1>
</div>
<div class="col-sm-4">
</div>
</div>
</div>
</body>
</html>
这里是它的JavaScript。
/**
* Created by Illuminati on 9/8/2016.
*/
var clicks = 0;
var multiplyer = 0;
function doClick() {
clicks = clicks + 1;
var theCounter = document.getElementById('counter');
theCounter.textContent = clicks;
}
if(clicks == 10){
alert("test");
}
将条件移动到函数内部。在它之外,它只能在页面加载时被读取,而且总是被误认为是错误的。 – SchattenJager
你认为我应该不停地做一个检查?或者你是否认为将它留在点击功能中会更聪明,因为它只会在点击后立即进行检查。 –
@KodySimpson不要把它放在一个区间内。如果唯一一次点击变化在函数内部,则不需要它。 –