jQuery的跳過塊

我有一個jQuery的遊戲，你可以查看這裏link text jQuery的跳過塊

遊戲通過在文本字段中輸入一個數字開始。然後你點擊播放按鈕。

點擊播放按鈕後，每個旋轉的隨機數字出現一組正方形，點擊具有您的數字的正方形來增加您的分數，錯過3次，結束。

我加入了遊戲到我的網站，你可以在這裏查看它link text

我遇到的問題是，我的網站成員將只保留光標放在一個盒子，等待他們的號碼出現在一個盒子。這毀了遊戲。有沒有辦法讓它不能連續多次點擊同一個盒子。在他們回來之前，他們必須點擊另一個框。

，這裏是我完整的腳本

var hitCount = 0, 
missCount = 0; 

function IsNumeric(n) { 
return !isNaN(n); 
} 

$("#getit").click(function() { 
var hitCount = 0, 
missCount = 0; 
$('#hitcount').text(0); 
$('#misscount').text(0); 

$('#message').hide(100); 
var li = [], 
    intervals = 0, 
    n = parseInt($('#MyNumber').val()); 

var intervalId = -1; 
if (IsNumeric(n)) { 
    intervalId = setInterval(function() { 
     li[intervals++ % li.length].text(Math.random() > .1 ? Math.floor(Math.random() * (10 + n) + (n/2)) : n).attr('class', '') ; 
    }, <?php echo $time ?>); 
} 

$('#randomnumber').empty(); 

for (var i = 0; i < 7; i++) { 
    li.push($('<li />').appendTo('#randomnumber')); 
} 

$('#randomnumber').delegate("li", "click", function() { 
     var $this = $(this); 

     if (!$this.hasClass('clicked')) { 
      if (parseInt($this.text(), 10) === n) { 
       $this.addClass('correct'); 
       $('#hitcount').text(++hitCount); 
      } else { 
       $this.addClass('wrong'); 
       $('#misscount').text(++missCount); 
      } 

      //New code If the missCount > 3 stop the game and save the value 
      if(missCount>=<?php echo $limit ?>){ 
       clearInterval(intervalId); 
       $('#randomnumber').undelegate("li", "click"); 
       // Use a ajax request to save the values 

$.ajax({ 
type : 'POST', 
url : 'FBhighscore_hwnd.php', 
dataType : 'json', 
data: { 
tgameid: $('#tgameid').val(),MyNumber: $('#MyNumber').val(),totalHits: hitCount 
}, 
success : function(data){ 
$('#waiting').hide(500); 
$('#message').removeClass().addClass((data.error === true) ? 'error' : 'success') 
.text(data.msg).show(500); 
if (data.error === true) 
$('#loginForm').show(500); 
else 
$('#send').hide(500); 
}, 
error : function(XMLHttpRequest, textStatus, errorThrown) { 
$('#waiting').hide(500); 
$('#message').removeClass().addClass('error') 
.text('There was an error.').show(500); 
$('#loginForm').show(500); 
} 
}); 

      } 
     } 

     $this.addClass('clicked'); 
    }); 

return false; 
});

來源

2010-11-15 John Sims

那麼你的代碼有什麼問題？ – Juan 2010-11-15 23:40:09

您是否嘗試過使用.one()綁定您的點擊事件而不是.click()？這裏是它的文檔：http://api.jquery.com/one/

如果你將點擊事件與.one()綁定，那麼你可以確保函數只會觸發一次。然後，在該功能中，重新綁定所有其他框的事件，從而確保他們必須再次點擊另一個框才能再次點擊相同的框。

或者：

使用的.hover()和setTimeout()（也可能是hoverIntent）的組合來禁用一個框，當用戶在徘徊他們的鼠標太久。

編輯

看一看你的jsfiddle的這款改裝版：http://jsfiddle.net/Ender/9ffTA/

點擊同一個盒子連續兩次被禁止。希望你可以用它作爲指導。

來源

2010-11-15 23:40:57 Ender

嘗試所有，沒有。不知道我是否以正確的方式使用它們 – 2010-11-16 00:09:05

John，我已經更新了我的答案，並附有我的第一個建議，該鏈接指向您演示的修改版本。 – Ender 2010-11-16 00:53:57

謝謝，我不得不爲那個工作一下，但我得到了它的工作。 delagate只是不會工作，所以現在，而不是undelegate我躲藏div。 – 2010-11-16 02:21:45

內的點擊，你可以標記框中顯示爲「鎖定」，只是禁止，直到下一次點擊。

來源

2010-11-15 23:40:43

如何？我的傢伙。這是我的大腦 – 2010-11-16 00:08:26

這不會解決您的問題。用戶仍然可以移動到另一個框並等待其號碼出現在該框中。我只是在你的網站上自己做了。我不相信目前的遊戲設計有問題的解決方案。

來源

2010-11-15 23:41:18

我不認爲問題是點擊，但與得分。

您建議的解決方案並沒有真正打敗「等待」作爲策略，因爲Drew points out。要真正解決等待，你需要給予懲罰。如果你是我的遊戲，我會有三個評分指標 - 正確點擊的框（你當前稱之爲「點擊」），錯誤點擊的框（......「未命中」）和未點擊的框（不在你當前的遊戲）。換句話說，如果我的數字是5，而在點擊它之前包含5個數字的盒子（被另一個數字代替），那就是對我的計數。

有了這種評分系統，任何人只要在盒子上懸停並等待 - 即使他們在點擊之間切換盒子 - 也會在他們錯過盒子時看到他們的分數越來越低。

來源

2010-11-16 01:23:08

我要添加倒數計時器，最長3分鐘。這應該消除等待的問題。 – 2010-11-16 03:14:51

jQuery的跳過塊

回答

相關問題