繁体   English   中英

jQuery 在 chrome 扩展弹出窗口中不起作用

[英]jQuery not working in chrome extension popup

我正在构建我的第一个 chrome 扩展程序,但遇到了一些麻烦。 我想在 popup.html 上使用 jQuery。 否则弹出窗口工作正常,但 jQuery 不起作用。

编辑:我改变了它,这是新代码,它仍然不起作用。 有任何想法吗? 我花了两个多小时试图弄清楚。 我是扩展的初学者,并且在 javascript 和 jquery 方面相当生疏,所以它肯定是一些小而尴尬的事情......非常感谢!

清单文件

  "content_scripts": [{
    "matches": [website], 
    "js": [
    "content.js", 
    "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"]
   }], 

弹出窗口.html

<!DOCTYPE html>
<html>
<head>
    <title>First Google Extension</title>
    <style>
    body { 
        font-family: "Segoe UI"; 
        width: 300px; 
        font-size: 14px; 
        }; 

    #changeMe {
        color: blue; 
        font-style: bold; 
        }; 
    </style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>

<body>
    Welcome to my first Google Chrome Extension! <br> 
    <div id="changeMe">
        I'm different!
    </div>
</body>

</html>

弹出窗口.js

$(document).ready(function() {
        $("#changeMe").append("Test!");  
});

你需要:

  1. 学习调试扩展弹出窗口 它会向您显示信息错误。

  2. 所述错误将参考内容安全策略。 所以你需要阅读有关扩展的CSP

  3. 阅读上述文档后,您需要解决的第一个问题是尝试使用远程脚本。 这是可能的 ,但对于像jQuery这样的东西,最好下载它的副本,将其添加到扩展的文件夹并将其包含为本地文件:

     <!-- refers to extension's own folder --> <script src="jquery.min.js"></script> 
  4. 其次,您需要在文件中收集自己的脚本并将其包含在内; 不允许以任何形式使用内联代码 ,内容脚本不适用于扩展页。

还要确保在jQuery.min.js之前包含popup.js 我犯了这个愚蠢的错误,在popup.js之前加载jQuery.min.js并且它不能那样工作。 所以总是先加载jQuery.min.js

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM