Очистка массива и очистка всех интервалов в Javascript - PullRequest
Новая
       20

Очистка массива и очистка всех интервалов в Javascript

2 голосов
/ 04 мая 2020

Я пытаюсь очистить или сбросить массив, как вы можете видеть ниже. У меня два <li> каждый установлен в 0. Как только первый <li> достигает 5, я хочу, чтобы он прекратил увеличиваться, и как только второй <li> достигнет 10, я также хочу, чтобы он прекратил увеличивать, это делается с помощью Каждая из функций setInterval имеет свою собственную переменную dynamici c name intervals[number] = seInterval().

По умолчанию я хочу вызвать функцию get_default (), чтобы она начала увеличиваться. Как вы можете видеть ниже, как только второй <li> сделан, я хочу предупредить значение в массиве intervals. Сначала он дает мне «1,2», затем при втором щелчке «6,7», затем при третьем щелчке «9,10» и т. Д.

У меня вопрос, как это получилось? не дает мне значение "0,1", так как это те значения, которые я передаю get_result(0); get_result(1);, и есть ли правильный способ очистить или сбросить все интервалы, которые выполняются, когда пользователь нажимает кнопку сброса? 

var intervals = [];

function get_result(number) {
  clearInterval(intervals[number]);
  intervals[number] = setInterval(function() {

    var total_count = parseInt($('ul li:eq(' + number + ')').html());
    var increment = total_count + 1;

    $('ul li:eq(' + number + ')').html(increment);

    if (number == 0 && increment == 5) {
      clearInterval(intervals[number]);
    }

    if (number == 1 && increment == 10) {
      clearInterval(intervals[number]);
      console.log(intervals);
    }
  }, 1000);

}

//Default
function get_default() {
  get_result(0);
  get_result(1);
}

//Run on default
get_default();


$('input').click(function() {
  //Reset
  intervals = [];
  $('li').html(0);
  get_default();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<ul>
  <li>0</li>
  <li>0</li>
</ul>

<input type="button" value="Reset">

1 Ответ

0 голосов
/ 04 мая 2020

Согласно MDN setTimeout возвращает числовое значение c.

Возвращенный интервалID представляет собой числовое значение c, ненулевое значение, которое идентифицирует таймер, созданный вызов setInterval (); это значение может быть передано WindowOrWorkerGlobalScope.clearInterval () для отмены тайм-аута.

При запуске фрагмента кода мы видим, что intervalID набора setTimeout выходит из массива.

Здесь, в моем фрагменте, я изменил тип данных интервалов на объект, с этим я могу сохранить аргумент get_result в качестве ключа, а интервал в качестве значения.

Надеюсь, это поможет вам. 

var intervals = {};

function get_result(number) {
  clearInterval(intervals[number]);
  intervals[number] = setInterval(function() {

    var total_count = parseInt($('ul li:eq(' + number + ')').html());
    var increment = total_count + 1;

    $('ul li:eq(' + number + ')').html(increment);

    if (number == 0 && increment == 5) {
      clearInterval(intervals[number]);
    }

    if (number == 1 && increment == 10) {
      clearInterval(intervals[number]);
      console.log(intervals);
    }
  }, 1000);

}

//Default
function get_default() {
  get_result(0);
  get_result(1);
}

//Run on default
get_default();


$('input').click(function() {
  //Reset
  intervals = {};
  $('li').html(0);
  get_default();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<ul>
  <li>0</li>
  <li>0</li>
</ul>

<input type="button" value="Reset">
...