jQuery反应测试延迟问题

Question

我在进行反应测试时遇到了一些问题：

• 好吧，首先，我想在播放器单击div之后随机暂停（2-5秒）。

• 其次，我希望div总共出现5次，因此玩家获得5次尝试。

对于第一个问题，我尝试使用setTimeout函数。 我试图通过使用“ for”循环来限制div出现的次数来解决第二个问题。

For example:

    for(var i = 1; i < 5; i++) {
        $div.css({
            left: Math.floor(Math.random() * widthMax),
            top: Math.floor(Math.random() * heightMax)
        });
    }

但是，我无法解决这两个问题。

您可以在这里尝试： http : //jsfiddle.net/tghca/7/

任何帮助将不胜感激！ 谢谢！

Answer 1

就像是

$('div').hide();

$('.start').click(function () {
    $(this).hide();
    $('.hint').hide();
    $('div').show();
    makeDiv();
});

var counter = 0;

function testClick() {
    var docHeight = $(document).height(),
        docWidth = $(document).width(),
        $div = $('#test'),
        divWidth = $div.width(),
        divHeight = $div.height(),
        heightMax = docHeight - divHeight,
        widthMax = docWidth - divWidth;

    $div.hide();
    setTimeout(function () {
        $div.css({
            left: Math.floor(Math.random() * widthMax),
            top: Math.floor(Math.random() * heightMax)
        }).show();
        counter++;
        if (counter < 5) {
            makeDiv();
        }
    }, Math.floor(Math.random() * 3000) + 2000)
}

function makeDiv() {
    $('#test').one('click', testClick);
}

演示： 小提琴