SetInterval с использованием значения до последнего?

Я разрабатываю расширение Google Chrome, и у меня есть довольно сложная проблема. (Я постараюсь, чтобы все было так просто, как я могу)

В принципе, я разрешаю пользователю настраивать интервальную скорость цикла setInterval. Я делаю это с полем ввода, который при вводе данных устанавливает значение localStorage на keyUp. Значение localStorage затем передается в контент script через API передачи сообщений Chrome, а цикл setInterval автоматически выбирает его.

options.html

<!--Call JavaScript functions after all elements are created-->

background.html

messagePassing.js

if(localStorage["scanTime"] == undefined || localStorage["scanTime"] == ""){
 localStorage["scanTime"] = 2000;
}
chrome.extension.onRequest.addListener(
 function(request, sender, sendResponse) {
 if (request.method == "getScanTime"){
 sendResponse({data: localStorage["scanTime"]});
 console.log("scanTime LS, response: " + localStorage["scanTime"]);
 }
 }
);

options.js

function setPref_customTime(){
 var inputBoxElement = document.getElementById("customTime_Input");
 localStorage["scanTime"] = inputBoxElement.value;
 console.log("scanTime LS, setPref_customTime(): " + localStorage["scanTime"]);
}

content.js

window.load = passMessages();
function passMessages(){
 chrome.extension.sendRequest({method: "getScanTime"}, function(response) {
 localStorage["scanTime"] = response.data;
 console.log("scanTime LS, request: " + localStorage["scanTime"]);
 });
 scanPage();
}
function scanPage(){
 console.log("scanTime LS, scanPage: " + localStorage["scanTime"]);
 setInterval(function match(){
 console.log("scanTime LS, match: " + localStorage["scanTime"]);
 }, localStorage["scanTime"]);
}

И консоль возвращает эти журналы после ввода пользовательского значения (он возвращает "2000" для всех журналов, когда загружается значение по умолчанию, как и должно):

scanTime LS, scanPage: 2000
scanTime LS, scanPage: 2000
scanTime LS, request: 5000
scanTime LS, request: 5000
scanTime LS, scanPage: 2000
scanTime LS, request: 5000
scanTime LS, match: 5000
scanTime LS, match: 5000
scanTime LS, match: 5000
scanTime LS, match: 5000
[etc]

Это ясно показывает, что setInterval использует новое значение, но страница и журнал обновляются со скоростью старого значения (и это не ошибка пользователя). Я использовал несколько разных значений несколько раз и имел одинаковые Результаты). Как может localStorage с тем же именем иметь разные значения на несколько строк?

Обновление. Я только что заметил, что консоль сообщает обо всех командах console.log(), за исключением "scanTime LS, response:". Это значимо?

1 ответ

Проблема, которую вы видите, у вас есть один цикл, работающий с 2000 мс, а затем просто запустите новый цикл с 5000 мс, оставив вас с двумя циклами, запущенными сразу. Вам нужно отменить первый, когда вы начинаете второй, используя clearInterval.

Что-то вроде этого должно работать.

function scanPage(){
 console.log("scanTime LS, scanPage: " + localStorage["scanTime"]);
 if (localStorage["intervalID"]) {
 clearInterval(localStorage["intervalID"]);
 }
 localStorage["intervalID"] = setInterval(function match(){
 console.log("scanTime LS, match: " + localStorage["scanTime"]);
 }, localStorage["scanTime"]);
}

licensed under cc by-sa 3.0 with attribution.