// 打地鼠操作 that.mousesWrap[0].addEventListener('click', function(e) { e = e || window.event; var elem = e.target || e.srcElement; (elem.style.display !== 'block' || elem.getAttribute('clicked') === '1') { return; } (elem.className.indexOf('bad') !== -1) { that.score -= that.badScore; } { that.score += that.goodScore; } elem.setAttribute('clicked', '1'); that.text(that.gameScore[0], that.score); }, false);

倒计时结束之后，清除两个计时器，同时将所有老鼠项display都设为none 即可（否则动画会一直循环展示出来）

// 倒计时，当前剩余游戏时间 countDown: function() { var that = this; var t = setInterval(function() { that.text(that.gameTime[0], --that.totalTime); if (that.totalTime === 0) { clearInterval(t); clearInterval(that.moveTime); for (var i = 0, j = that.mouses.length; i < j; ++i) { that.mouses[i].style.display = 'none'; } alert('游戏结束，得分为：' + that.score); } }, 1000); },

1 function MouseGame() { 2 this.mousesWrap = this.$('.game-content'); 3 this.mouses = this.$('.game-content div'); 4 this.gameStart = this.$('#game-start'); 5 this.gameTime = this.$('#game-time'); 6 this.gameScore = this.$('#game-score'); 7 this.goodScore = 100; 8 this.badScore = 50; .bindEvent(); 11 } 12 13 MouseGame.prototype = { 14 constructor: MouseGame, * 17 * 获取元素 18 * @param {String} elem 元素的字符串标识 19 * @example 20 * $('div') | $('p.active') 21 * @return {NodeList} 获取的元素集 $: function(elem) { 24 return document.querySelectorAll(elem); 25 }, * 28 * 获取给定范围的随机数 29 * @param {Number} from 起始 30 * @param {Number} to 结束 31 * @return {Number} 随机数 getRandom: function(from, to) { 34 return Math.floor(Math.random() * (to - from + 1)) + from; 35 }, * 38 * 设置元素内容 39 * @param {HTMLElement} elem 要设置的元素 40 * @param {String} val 设置的内容 41 * @return {String} 设置好的内容|元素本身的内容 text: function(elem, val) { 44 if (elem.textContent) { 45 return val !== undefined ? elem.textContent = val : elem.textContent; 46 } else if (elem.innerText) { 47 return val !== undefined ? elem.innerText = val : elem.innerText; 48 } 49 }, moveUpAndDown: function() { 53 var that = this; that.moveTime = setInterval(function() { (var i = 0, j = that.mouses.length; i < j; ++i) { 59 that.mouses[i].setAttribute('clicked', '0'); 60 that.mouses[i].className = 'good active'; 61 that.mouses[i].style.display = 'none'; 62 } badNum = that.getRandom(0, 8); 66 for (var i = 0; i < badNum; i++) { 67 that.mouses[that.getRandom(0, 8)].className = 'bad active'; 68 } showNum = that.getRandom(0, 8); 72 for (var i = 0; i < showNum; i++) { 73 that.mouses[that.getRandom(0, 8)].style.display = 'block'; 74 } 75 }, 2000); 76 }, bindEvent: function() { 80 var that = this; that.gameStart[0].addEventListener('click', function() { 84 that.startGame(); 85 }, false); that.mousesWrap[0].addEventListener('click', function(e) { 89 e = e || window.event; 90 var elem = e.target || e.srcElement; (elem.style.display !== 'block' || elem.getAttribute('clicked') === '1') { 93 return; 94 } (elem.className.indexOf('bad') !== -1) { 97 that.score -= that.badScore; 98 } { 101 that.score += that.goodScore; 102 } 103 104 elem.setAttribute('clicked', '1'); 105 that.text(that.gameScore[0], that.score); 106 }, false); 107 }, countDown: function() { 111 var that = this; t = setInterval(function() { 114 that.text(that.gameTime[0], --that.totalTime); (that.totalTime === 0) { 117 clearInterval(t); 118 clearInterval(that.moveTime); (var i = 0, j = that.mouses.length; i < j; ++i) { 121 that.mouses[i].style.display = 'none'; 122 } 123 124 alert('游戏结束，得分为：' + that.score); 125 } 126 }, 1000); 127 }, startGame: function() { 131 this.score = 0; 132 this.totalTime = 60; 133 this.text(this.gameTime[0], this.totalTime); 134 this.text(this.gameScore[0], this.score); .countDown(); 137 this.moveUpAndDown(); 138 } 139 }; MouseGame();

代码有注释应该不难看懂了

那么..快来fork吧..