1

我是扩展的新手，这让我发疯。当我在浏览器中本地加载页面时，我的倒计时工作，但是当我尝试使其成为扩展时，只显示 html，并且 javascript 不起作用（例如，当我在启动扩展时单击开始按钮时，没有任何变化，倒计时永远不会开始。）我把我的代码放在下面，它与我没有把javascript放在“背景”中有关吗？我不明白 Chrome Docs 的那部分

    <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>
4

1 回答 1

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>
于 2013-02-21T15:36:02.533 回答