Question

我使用Jquery UI拖放元素'阁楼'中的元素'蜘蛛'

$('.animaux').draggable( {
  containment: '.page',
  stack: '.menu_animaux img',
  cursor: '-webkit-grab',
  revert: 'invalid',
  helper: 'clone'     
});

$('#grenier').droppable( {
  accept: '.l_grenier',
  hoverClass: 'hovered',
  drop: grenierDrop      
});

蜘蛛的下落调用一个函数'grenierDrop'，在阁楼中随机创建一个新的蜘蛛：

$('<img class="araignee" src="img/araignee.png" />').css({
        'position':'absolute',
        'top': (Math.random() * ($('#grenier').height() - $('.araignee').height())).toFixed()+'px',
        'left': (Math.random() * ($('#grenier').width() - $('.araignee').width())).toFixed()+'px'
        }).appendTo('#grenier').addClass("animated tada");

我想重复此功能10次，每次之间有延迟。我知道如何同时创建10个蜘蛛（使用FOR循环），但不知道如何一个接一个地创建它们，例如延迟2秒（我尝试了setTimeout，setInterval，FOR循环，但没有任何结果）

我认为这是一个基本问题，但我是初学者......感谢您的帮助

Answer 1

setInterval是做到这一点的关键。

var counter = 0;

var timer = setInterval(function() {
    // Do some stuff

    counter += 1;
    if (counter >= 10) {
        // Kill the timer after 10 times
        clearInterval(timer);
    }

}, 2000 /* In ms. So it's 2 seconds */);

jQuery - 一个接一个地创建x个元素

1 个答案: