[英]Any error in my JQuery code? The lottory can only move one step after click start
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>lottery</title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
.container{
position: absolute;
top: 0;
left:0;
width: 100%;
height: 100%;
background: #333;
}
.nine{
position: relative;
margin: 20px auto;
height: 300px;
width: 300px;
}
.items{
background: #eee;
border-radius: 50px;
width: 80px;
height: 80px;
text-align: center;
}
.active{
background-color: red;
color: #fff;
box-shadow: 0 0 16px rgba(33,154,219,.8), 0 1px 2px rgba(0,0,0,.2) ;
}
.btn-start{
background-color: #3385ff;
cursor: pointer;
color: #fff
}
</style>
</head>
<body>
<div class="container">
<table class="nine">
<tbody>
<tr>
<td class="items" data-index="1">1</td>
<td class="items" data-index="2">2</td>
<td class="items" data-index="3">3</td>
</tr>
<tr>
<td class="items active" data-index="8">8</td>
<td class="items btn-start" data-index="9">start</td>
<td class="items" data-index="4">4</td>
</tr>
<tr>
<td class="items" data-index="7">7</td>
<td class="items" data-index="6">6</td>
<td class="items" data-index="5">5</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript" src="../js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
var gRunning = false;
$(".btn-start").click(function(e){
if(gRunning){
return;
}
gRunning = true;
next(parseInt(Math.random()*50));
});
function next(time){
var activeItem = $(".items.active"),
activeIndex = activeItem.data("index"),
max = $(".items").length -1,
nextTime = time + 5* time/50,
nextIndex = 1,
nextItem = null;
if (activeIndex = max) {
nextIndex = 1;
}
else{
nextIndex = activeIndex + 1;
}
activeItem.removeClass("active");
nextItem = $(".items[data-index="+nextIndex+"]").addClass("active");
if (time>800) {
gRunning = false;
var info = nextItem.text();
alert("Congrats, you got "+ info);
}
else{
window.setTimeout(function(){
next(nextTime);
},nextTime);
}
}
</script>
</body>
</html>
這段代碼在我點擊“開始”按鈕后停在 data-index:1 處,然后過了一會兒,警告框會彈出,“congrants, you got 1”。 代碼中的任何錯誤導致它沒有前進??? 它應該滾動幾個圓圈然后減速然后停止並彈出警報框。
這是賦值,不是比較:
if (activeIndex = max)
使用==
if (activeIndex == max)
if (activeIndex = max) {
這是每次都將 activeIndex 設置為 max,因此nextIndex
將始終為 1。
用
if (activeIndex == max) {
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.