Функция простого JavaScript-сброса

Я хотел бы сделать функцию счетчика и точную переменную для времени начала и места для отображения.Функция простого JavaScript-сброса

Так что, если я хотел бы иметь много счетчика на каждой странице, я могу легко управлять:

$(document).ready(function() { 

      // set time and place (where to display the counter) 
      function countDown(time, place){ 

       if(time > 0){ 
        time--;  
        setInterval(function(){countDown(time,place)}, 1000); 
       } // end if 

       if(time == 0) 
       { 
        window.clearInterval(time); 
       } 
      } // end function 

        $('.click').click(function(){ 
         countDown(30, '#counter');        

        }); 

}); // end DOM 

    </script> 
</head> 


<body> 
    <div class="click">clickme</div> 
    <br /> 

    <div id="counter">30</div> 

</body>

Заранее спасибо

источник

2013-12-19 Abu Rayane

Вы забыли задать свой вопрос? – fbynite

Обратите внимание, что * setInterval * не работает точно с заданным интервалом, поэтому приведенное выше не будет выполняться ровно через 1 секунду, поэтому простое уменьшение значения для каждого вызова не будет точно отражать количество прошедших секунд. Функция также вызывает себя при каждом прогоне, поэтому примерно через 30 секунд у вас будет 30 таймеров. – RobG

Кроме того, * clearInterval * ожидает, что будет передано значение, возвращенное из вызова, в * setInterval *, а не '0'. – RobG

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

<html> 
    <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
    </script> 
    <script> 


       var myVar; 
var clickcount=0; 

function countDown (time, place) { 
     if (time > 0) { 

     $(place).html(time); 
     time--; 
     myVar=setTimeout(function() { countDown(time, place); }, 1000); 
    } 
} 

function startreset(time,place){ 
     clickcount++; 
     if(clickcount % 2 === 0){ 
      clearTimeout(myVar);    
     } else { 
      countDown(time,place); 
     } 

    } 

$('.click').click(function(){ 
     startreset(30, '#counter');        
     }); 



     </script> 
    </head> 




<body> 
     <div class="click" onClick="javascript:countDown(30,'#counter');">clickme</div> 
     <br /> 

     <div id="counter">30</div> 

    </body>

источник

2013-12-19 03:28:23

Спасибо всем вам, ребята, я что-то заметил, если я нажму «кликнуть меня», счетчик запустился, и если я снова нажму, снова запустится счетчик, есть способ сбросить его в обоих направлениях: 1- После повторного нажатия на сброс на 0, 2- Пауза. Если кто-нибудь может объяснить мне обоим ситуациям Спасибо, ребята –

Храните глобальную переменную, чтобы отслеживать ее, если она была нажата. Это может быть count = 0; Каждый раз, когда вы нажимаете кнопку вызова, функция увеличивает счетчик. Основанный счетчик% 2 = 0/1, вы что-то делаете. Пожалуйста, поддержите мой ответ, если считаете, что это было полезно. –

Я протестировал это, просто чтобы проверить, есть ли у меня идея ура, но, похоже, что-то там висит: function clearTimer (ident) {ident ++; if (ident% 2 == 0) {alert (0); } else {alert (1); }} $ ('. click'). click (function() {countDown (30, '#counter'); clearTimer (1);}); –

проблему вы Вероятно, это то, что вы вызываете setInterval несколько раз. setInterval делает больше, чем просто ждать x миллисекунд, о которых вы рассказываете, а затем вызывать свой метод, он продолжает, чтобы вызвать ваш метод каждый последующий x миллисекунд. Таким образом, когда вы вызываете countDown в первый раз, для вашей функции устанавливается интервал. Этот интервал истекает, и countDown вызывается снова. Все отлично до сих пор, но теперь второй звонок countDown устанавливает ДРУГОЙ setInterval. Программа будет ждать вашего x миллисекунд, чтобы вызвать countDown из второго setInterval, но он будет вызывать его из первого setInterval раньше.

... Другими словами, вы не должны повторно звонить setInterval. То, что вы хотите, - setTimeout, которое ждет указанного количества времени и затем вызывает указанный метод один раз.

function countDown (time, place) { 
    if (time > 0) { 
    time--; 
    $(place).html(time); 
    setTimeout(function() { countDown(time, place); }, 1000); 
    } 
}

В качестве альтернативы, если вы не чувствуете себя рекурсивную сегодня:

function countDown (time, place) { 
    var interval = setInterval(function() { 
    if (time > 0) { 
     time--; 
     $(place).html(time); 
    } else { 
     window.clearInterval(interval); 
    } 
    }, 1000); 
}

который рычаги setInterval, но только один раз.

JSFiddle при условии: http://jsfiddle.net/LKvBR/

источник

2013-12-19 03:46:37 mtoor

Я протестировал этот, просто чтобы проверить, есть ли у меня ур идея, но, похоже, что-то висит там: [код] функция clearTimer (ident) { ident ++; if (ident% 2 == 0) { alert (0); } else { alert (1); ('Нажмите'). } } $ нажмите (функция() { CountDown (30, '#counter'); clearTimer (1); }); [/ code] –

Функция простого JavaScript-сброса

ответ

Смежные вопросы