Question

编写一个简单的chrome扩展，因此JS必须用它自己的.js文档编写。

options.html

<!DOCTYPE html>

<html>
    <head>
        <title>Proxy Extension</title>
        <link rel="stylesheet" href="stylesheets/style.css">
        <script src = "jquery-3.2.1.min.js" type="text/javascript"></script>
        <script src = "options.js"></script>
    </head>
    <body>
        <div id="settings" align="center">
        <form>
            <input type="text" class="info" id="Addy" placeholder="Address">
            <input type="number" class="info" id="Port" placeholder="Port" max="9999">
            <p></p>
        </form>
            <input type="button" id="box" value="Update">
        </div>
    </body>
</html>

options.js

$(document).ready(function(){
    $("#box").click(function(){
        alert("placeholder");
    });
});

功能应该是超级简单的。按按钮：发出警报。问题是，我没有得到警报。

Answer 1

这是因为应该在脚本之前加载jquery。

Answer 2

您需要重新订购脚本加载。

脚本按遇到的方式执行，因此您的options.js文件在加载jQuery库之前执行，因此在$(document)行失败。

如果您打开开发工具，您将在控制台日志中看到错误。

所以使用

<script src="jquery-3.2.1.min.js" type="text/javascript"></script>
<script src="options.js"></script>

Answer 3

您可能会收到此控制台错误：

toPromise

要解决此问题，请导入jQuery库BEFORE options.js。

Uncaught ReferenceError: $ is not defined

此外，将options.js代码更改为 .click（）而不是.onclick（）

<script src = "jquery-3.2.1.min.js"></script>
<script src = "options.js"></script>

HTML Javascript按钮提醒Onlcick

3 个答案: