Question

我有一个jquery游戏，你可以在这里查看link text

游戏首先在文本字段中输入数字。然后单击播放按钮。

点击播放按钮后，每个旋转的随机数会出现一组方块，点击有你的号码的方块来建立你的分数，错过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;
});

Answer 1

您是否尝试过使用.one()绑定点击事件而不是.click()？这是它的文档：http://api.jquery.com/one/

如果将click事件与.one()绑定，则可以确保该函数仅触发一次。然后，在该函数内部，重新绑定所有其他框的事件，从而确保在再次单击相同的框之前必须单击另一个框。

可替换地：

使用.hover()和setTimeout()（以及可能hoverIntent）的组合来禁用当用户将鼠标悬停在其上太久时的框。

修改

看看你的jsFiddle的这个修改版本：http://jsfiddle.net/Ender/9ffTA/

不允许连续两次单击同一个框。希望您可以将其作为指南。

Answer 2

在您的点击内，您可以将该框标记为“已锁定”，并在下次点击之前将其停用。

Answer 3

这不会解决你的问题。用户仍然可以移动到另一个盒子并等待他们的号码出现在该盒子中。我刚刚在你的网站上做过。我认为目前的游戏设计无法解决您的问题。

Answer 4

我认为问题不在于点击，而在于得分。

你提出的解决方案并没有真正击败“等待”作为一种策略，如Drew points out。要真正解决等待问题，你需要给它一个惩罚。

如果是我的游戏，我会有三个评分指标 - 正确点击的框（你当前称之为“点击”），错误点击的框（......“未命中”）和未点击的框（不在你的目前的比赛）。换句话说，如果我的号码是5，并且在我点击它之前包含5个淡化的盒子（被另一个号码替换），那就算是对我不了。

有了这个评分系统，任何只是在一个盒子上盘旋并等待的人 - 即使他们在点击之间切换盒子 - 也会看到他们的分数越来越低，因为他们错过了盒子。

jquery跳过一个块

4 个答案: