Chrome扩展程序 - 在作为HTML文件访问时工作,但不作为扩展名

时间:2022-10-24 10:25:22

I am making an extension for chrome, however this is my first time doing that and so I made a simple script to see if I was doing it correctly.

我正在为chrome做一个扩展,但这是我第一次这样做,所以我做了一个简单的脚本,看看我是否正确地做了。

This script works fine when view as a regular page in the browser, but when it is loaded as a chrome extension it falls down completely. Could someone tell me what special thing has to be changed to allow this to work as an extension?

当在浏览器中作为常规页面查看时,此脚本可以正常工作,但当它作为chrome扩展加载时,它会完全崩溃。有人可以告诉我有什么特别的东西需要改变才能让它作为扩展工作吗?

HTML:

<!doctype html>
<html>
    <head>
        <script src='lib/jquery-1.11.0.min.js'></script>
        <script src='lib/jquery.knob.js'></script>
        <script src='script.js'></script>
    </head>
    <body>
        <input type='text' value='0' class='dial' id='dis'>
        <input type='text' id='in' placeholder='Enter percent to change to'>
        <button onclick="change()">Change it!</button>
    </body>
</html>

Javascript:

$(function() {
    $("#dis").knob({
        'readOnly':true
    });
});
function change(){
    var num = document.getElementById('in').value;
    $('#dis').val(num).trigger('change');
};

Zip containing extension and source files.

包含扩展名和源文件的Zip。

Online working version (couldn't get it working on JsFiddle or JsBin)

在线工作版本(无法在JsFiddle或JsBin上运行)

1 个解决方案

#1


1  

Please carefully read the documentation on Chrome's Content Security Policy.

请仔细阅读有关Chrome内容安全政策的文档。

Your problem is in using onclick attribute. It counts as inline code. You need to get rid of it.

您的问题在于使用onclick属性。它算作内联代码。你需要摆脱它。

HTML:

<button id="button">Change it!</button>

Script:

$(function() {
    $("#button").click(change);
    $("#dis").knob({
        'readOnly':true
    });
});

#1


1  

Please carefully read the documentation on Chrome's Content Security Policy.

请仔细阅读有关Chrome内容安全政策的文档。

Your problem is in using onclick attribute. It counts as inline code. You need to get rid of it.

您的问题在于使用onclick属性。它算作内联代码。你需要摆脱它。

HTML:

<button id="button">Change it!</button>

Script:

$(function() {
    $("#button").click(change);
    $("#dis").knob({
        'readOnly':true
    });
});