Почему этот код setTimeout создается и не завершается? - PullRequest
Новая
       6

Почему этот код setTimeout создается и не завершается?

0 голосов
/ 31 октября 2010

Если вы щелкнете мышью по тексту html один раз и подождите, пока шарик выйдет за пределы экрана, это нормально.Однако, если вы нажмете 2+ раза, вы заметите, что мяч движется быстрее.Когда вы снова нажимаете на тело, чтобы вернуть мяч, оно все еще быстрее, чем должно быть.Зачем?http://jsfiddle.net/44nwt/10/

-edit- в firefox на моей странице (я не пробовал на jsfiddle) я заметил, что функция move вызывается повторно, даже после того, как мяч покинул экран и был удален.Почему он не существует?

Ответы [ 2 ]

1 голос
/ 31 октября 2010

Это работает (http://jsfiddle.net/44nwt/11/)

было две проблемы:

# 1 каждый щелчок создает еще один экземпляр шара и ballwrapper, и добавляет их в телоНеобходимо создать экземпляр, только если он еще не существует. Так что это будет выглядеть примерно так: 

 $('body').click(function() {
    var wrapper = $('.ballwrapper');
    if( wrapper.length == 0 ) {
        $('body').append('<div class="ballwrapper"><img class="ball" src="http://michaelreid.typepad.com/.a/6a00e54edabd838833011168a00f09970c-800wi"/></div>');
    }
    MoveCode();
});

# 2 Вам нужны ворота в начале вашегоФункция MoveCode для предотвращения продолжения «лишних» циклов (запускаемых при каждом дополнительном щелчке) после удаления шарика / шарикоподшипника. 

function MoveCode() {
    var wrapper = $('.ballwrapper');
    if( wrapper.length == 0 ) return;

    var l = $('.ball').css("left");
    var left = parseInt(l);
    if (left > parseInt(wrapper.css('width'))) {
        //alert('removed');
        wrapper.remove();
        return;
    }

    $('.ball').css("left", (left + 60) + "px");
    setTimeout(MoveCode, 160);
}

Также обратите внимание ... Я изменил его наудалите шариковую упаковку вместо того, чтобы просто удалить шарик, в противном случае, если вы пропустите его снова и снова, вы накапливаете старые, неиспользованные шариковые упаковщики на заднем плане.

1 голос
/ 31 октября 2010 
if (left > parseInt($('.ballwrapper').css('width'))) {
    //alert('removed');
    $('.ball').remove();
    return;
}

Если слева не определено (т. Е. Мяч уже удален), тогда условие ложно и планирование будет выполняться повторно

...