倒数Javascript无法在Chrome扩展程序上运行

Question

我是扩展的新手，这让我发疯。 当我在浏览器中本地加载页面时，我的倒计时有效，但是当我尝试将其扩展为扩展名时，仅显示html，而javascript不起作用（例如，启动扩展名时单击“开始”按钮时，没有任何变化，并且倒数计时永远不会开始。）我将代码放在下面，这与我没有将javascript置于“背景”有关吗？ 我不了解Chrome文档的这一部分

    <html>
  <head>
  </head>
  <body>

<script>var countdown;
var countdown_number=10000*3600
var days;
var hours;
var minutes;
var seconds;

function countdown_init() {
    //countdown_number = 11;
    countdown_trigger();
}

function countdown_trigger() {
    if(countdown_number > 0) {
        countdown_number--;
        //store()
        days = Math.floor(countdown_number/(3600*24))
        hours = (Math.floor(countdown_number/(3600))-days*24) % 24;
        minutes = (Math.floor(countdown_number/(60))-hours*60) % 60;
        seconds = (Math.floor(countdown_number)-minutes*60) % 60;
        update_counter();
        if(countdown_number > 0) {
            countdown = setTimeout('countdown_trigger()', 1000);
        }
    }
}

function update_counter(){
     document.getElementById('timer_text').innerHTML = "Days: "+days+"<br>"+
        " Hours: " + hours +"<br>"+" Minutes: " + minutes +"<br>"+" Seconds: " + seconds;
}

function countdown_clear() {
    clearTimeout(countdown);
}

function countdown_reset(){
    countdown_number=10000*3600;
    update_counter();
    clearTimeout(countdown);
}

function writeItem(){
    localStorage[1] = countdown_number;
}

function returnItem() {
    var stored = localStorage[1];
    document.getElementById('item').innerHTML=countdown_number;
  }

function store(){
    writeItem();
}
</script>

<div>
    <h1> 10,000 Hours Timer </h1>
    <input type="button" value="start countdown" onclick="countdown_init()" />
    <input type="button" value="stop countdown" onclick="countdown_clear()" />
    <input type="button" value="reset" onclick="countdown_reset()"/>
    <input type="button" value="store" onclick="store()"/>
    <p id="item">Hi</p>
</div>
<div id="timer_text">Ready To Start?</div>
  </body>
</html>

Answer 1

Chrome扩展程序不支持嵌入式JavaScript。 http://developer.chrome.com/extensions/contentSecurityPolicy.html

试试这个JS：

document.addEventListener('DOMContentLoaded', function () {
  document.querySelector('#start').addEventListener('click', countdown_init);
  document.querySelector('#stop').addEventListener('click', countdown_clear);
  document.querySelector('#reset').addEventListener('click', countdown_reset);
  document.querySelector('#store').addEventListener('click', store);

});

var countdown_number=10000*3600;
var days;
var hours;
var minutes;
var seconds;
var countdown;

function countdown_init(e) {
    //countdown_number = 11;
    countdown_trigger();
}

function countdown_trigger() {
    if(countdown_number > 0) {
        countdown_number--;
        //store()
        days = Math.floor(countdown_number/(3600*24));
        hours = (Math.floor(countdown_number/(3600))-days*24) % 24;
        minutes = (Math.floor(countdown_number/(60))-hours*60) % 60;
        seconds = (Math.floor(countdown_number)-minutes*60) % 60;
        update_counter();
        if(countdown_number > 0) {
            countdown = setTimeout(countdown_init, 1000);
        }
    }
}

function update_counter(){
     document.getElementById('timer_text').innerHTML = "Days: "+days+"<br>"+
        " Hours: " + hours +"<br>"+" Minutes: " + minutes +"<br>"+" Seconds: " + seconds;
}

function countdown_clear(e) {
    clearTimeout(countdown);
}

function countdown_reset(e){
    countdown_number=10000*3600;
    update_counter();
    clearTimeout(countdown);
}

function writeItem(){
    localStorage[1] = countdown_number;
}

function returnItem() {
    var stored = localStorage[1];
    document.getElementById('item').innerHTML=countdown_number;
  }

function store(e){
    writeItem();
}

和HTML：-

<div>
    <h1> 10,000 Hours Timer </h1>
    <input type="button" id="start" value="start countdown"  />
    <input type="button" id="stop" value="stop countdown"  />
    <input type="button" id="reset" value="reset" />
    <input type="button" id="store" value="store" />
    <p id="item">Hi</p>
</div>
<div id="timer_text">Ready To Start?</div>

倒数Javascript无法在Chrome扩展程序上运行

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-02-21 15:36:02

倒数Javascript无法在Chrome扩展程序上运行

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-02-21 15:36:02

解决方案1
1 已采纳 2013-02-21 15:36:02