Question

我认为我会构建镀铬扩展程序来倒计时。如果是现在的代码，如果popup.html关闭，处理将强制完成。在这种情况下，将setInterval写入background.js会更好吗？而且，我希望你教我是否应该具体做什么。

background.js

var num = window.localStorage.setItem("minite_num", 20);
default_count = num*60;

function count_start() {
    count = default_count;
    chrome.browserAction.setIcon({
        path: {
            "19": "img/icon_count19.png",
            "38": "img/icon_count38.png"
        }
    });
}

function count_down() {
count--;
if (count <= 0) {
    page_change();
    count_stop();
    }
}

popup.js

var bg = chrome.extension.getBackgroundPage();
var num = bg.num;
var start_btn = document.count_timer.start_btn;
var count_time = document.getElementById("counter");

document.addEventListener('DOMContentLoaded', function () {
    load();
    start_btn.addEventListener('click', start_display);
});

function timer_reset() {
    timerID = 0;
}

function count_format(num) {
    var tm,ts;
    tm = Math.floor(num / 60); //分
    ts = num % 60; //秒
    if (ts < 10) ts = "0" + ts;
    return tm + ":" + ts;
}

function load(){
    display_num = bg.count_format(bg.default_count);
    bg.timer_reset();

    start_btn.disabled = false;
    count_time.innerHTML = display_num;
}

function start_display() {
    start_btn.disabled = true;
    bg.count_start();
    timerID = setInterval(function() {bg.count_down();count_time.innerHTML = bg.count;}, 1000);
}

popup.html

<form name="count_timer" class="count_timer">
    <div id="counter" class="counter"></div>
    <input type="button" name="start_btn" value="START">
</form>

感谢。

Answer 1

使用chrome storage / localStorage记住您的目标时间。使用弹出窗口中的间隔更新计算。第一次，弹出窗口需要从存储中读取并确定倒计时的位置。没有什么需要从后台完成，除非你想要分离逻辑（如在MVC中），然后可能从后台做所有存储的东西，并通过消息传递请求它。我有一个已发布的开源chrome扩展（加上trello），带有count（up）计时器功能，可以做类似的事情。

倒数计时器工作停止镀铬扩展。

1 个答案: