Функция обратного отсчета JQuery в IE - PullRequest
0 голосов
/ 02 ноября 2011

У меня странная проблема с IE8 и ниже, когда мой отсчет времени, который должен срабатывать только один раз, продолжает срабатывать, чего не происходит в современных браузерах.Есть ли способ это исправить?Спасибо!Цель - начать обратный отсчет после выбора входа.

Код:

$("input").focus (function counter() {
  $("input").unbind('focus', counter);
  var count = 60;
  countdown = setInterval(function(){
    $(".clock p").html(count);
    if (count == 0) {
      $(".while-ticking").fadeOut(1000);
      $(".countdown-finished").fadeIn(1000);
    }
    else {
        count--;
    }
  }, 1000);
});

1 Ответ

0 голосов
/ 02 ноября 2011

Попробуйте это так:

$("input").focus(function() { counter(60) });

function counter(count) {
    $("input").unbind('focus');
    setTimeout(function(){
        $(".clock p").html(count);
        if (count == 0) {
            $(".while-ticking").fadeOut(1000);
            $(".countdown-finished").fadeIn(1000);
        }
        else {
            counter(count--);
        }
    }, 1000);
}

Редактировать: Вам необходимо создать цикл для обратного отсчета.Итак, в основном я начинаю с 60, подождите секунду и снова вызову функцию, но затем с 59 ... и т. Д. И т. Д., Когда его 0 больше не вызывает функцию, поэтому он остановился

Редактировать: Я проверил это следующим образом, и это сработало :) очень хорошо отсчитывал

<script type="text/javascript" src=".............../jquery-1.4.4.min.js"></script>
<script type="text/javascript">

    $(document).ready(function() {

        $("input").focus(function() { counter(60) });

    });

    function counter(count) {
        $("input").unbind('focus');
        $(".clock p").html(count);
        setTimeout(function(){
            if (count == 0) {
                $(".while-ticking").fadeOut(1000);
                $(".countdown-finished").fadeIn(1000);
            }
            else {
                console.log(count--);
                counter(count--);
            }
        }, 1000);
    }

</script>


<input type="text" />

<div class="clock">
    <p></p>
</div>
...