Jquery: считать с помощью setInterval

Question

Я пытаюсь создать два счетчика, когда я нажимаю downKey, я хочу, чтобы counter1 начал считать, а когда я нажимаю keyLeft, я хочу остановить первый счетчик и запустить counter2 .... Я знаю, что мне нужно использовать функцию clearInterval(), но я не знаю, где мне это нужно, вот < сильный > JSFiddle чтобы понять, что я имею в виду

Html:

<div id="left"></div>
<div id="down"></div>

Js:

$('body').keydown(function (e) {
  switch (e.which) {
    case 39:
      clearInterval(down_move);
      var i=0;
      var right_move = setInterval(function(){
        $('#left').html(i);
        i++
      }, 1000)
      break;
    case 40:
      clearInterval(right_move);
      var j = 0;
      var down_move = setInterval(function(){
        $('#down').html(j)
                j++;
      }, 1000);
      break;
    default:

  }
  e.preventDefault();
});

javascript jquery

0

elreeda 17 Дек 2015 в 13:31

Answer 1

Вам нужно объявить down_move и right_move вне keydown:

var right_move, down_move;
$('body').keydown(function (e) {
  switch (e.which) {
    case 39:
      clearInterval(down_move);
      var i=0;
      right_move = setInterval(function(){
        $('#left').html(i);
        i++
      }, 1000)
      break;
    case 40:
      clearInterval(right_move);
      var j = 0;
      down_move = setInterval(function(){
        $('#down').html(j)
                j++;
      }, 1000);
      break;
    default:

  }
  e.preventDefault();
});

4

jcubic 17 Дек 2015 в 10:38

Answer 2

Вы должны хранить вне функции интервал до остановки.
Внимание, код ascii слева - 37.

Вот JSFiddle, чтобы увидеть мои изменения:

var storeInterval = null;
$('body').keydown(function (e) {
  switch (e.which) {
    case 37:
      clearInterval(storeInterval);
      var i=0;
      storeInterval = setInterval(function(){
        $('#left').html(i);
        i++
      }, 1000)
      break;
    case 40:
      clearInterval(storeInterval);
      var j = 0;
      storeInterval = setInterval(function(){
        $('#down').html(j)
				j++;
      }, 1000);
      break;
    default:

  }
  e.preventDefault();
});

<div id="left"></div>
<div id="down"></div>

0

Oscar Talamo 17 Дек 2015 в 11:32

Answer 3

Это похоже на проблему сферой, вот как я бы это сделал: обновленная скрипка

var Interval = function(intervalFunc, selector){
  var interval;
  this.start = function(){
    interval = setInterval(intervalFunc, 1000);
  },
  this.stop = function(){
    clearInterval(interval);
  }
}

var i = 0;
var rightBtnInterval = new Interval(function downInterval(){
        $('#right').html(i)
                i++;
      });

var j = 0;
var downBtnInterval = new Interval(function downInterval(){
        $('#down').html(j)
                j++;
      });



$('body').keydown(function (e) {
  switch (e.which) {
    case 39:
      rightBtnInterval.stop();
      downBtnInterval.start();
      break;
    case 40:
      downBtnInterval.stop();
      rightBtnInterval.start();
      break;
    default:

  }
  e.preventDefault();
});

0

amarch 17 Дек 2015 в 11:04

Jquery: считать с помощью setInterval

3 ответа

Похожие вопросы

Новые вопросы

javascript