Question

我正在尝试在我的系统上运行此SO问题中的示例代码

getting the X/Y coordinates of a mouse click on an image with jQuery

它显示鼠标在div内点击的位置。它在Firefox和Safari上工作正常但在Chrome上没有更新，我想知道我是否做错了什么。我使用的是Google Chrome版本23.0.1271.101

这是我正在使用的代码。

<html>

<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
</head>

<body>
<p>Click to see the position!</p>
<div class="box" style="width: 200px; height: 200px; background: #F00">&nbsp;</div>
<p id="position">Position will go here</p>
<script>
$(document).ready(function() {
    $('.box').click(function(e) {
        var offset = $(this).offset();
        $('#position').html(Math.round(e.clientX - offset.left) + ", " + Math.round(e.clientY - offset.top));
    });
});
</script>

</body>
</html>

更新以下是我在Chrome的JavaScript控制台Uncaught ReferenceError: $ is not defined上看到的错误，但我不知道该怎么做。

enter image description here

UPDATE2：

我清除了浏览器缓存并重新加载了页面，同时打开了JavaScript控制台并注意到我之前没见过的错误

[blocked] The page at https://<mywebsite>/index.html ran insecure content from http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js.
Uncaught ReferenceError: $ is not defined

所以，我下载了jquery.min.js并将其放在与index.html相同的目录中，并将脚本的加载更改为

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

它现在可以在所有三种浏览器上运行....所以出于某种原因，Chrome是唯一抱怨jquery.min.js不安全的网址的人。为了解决这个问题，当我进入JavaScript控制台时，它没有给我这个错误，直到我清除缓存和我才开启了JavaScript控制台后才看到它。< / p>

Answer 1

您遇到的错误是在执行脚本时未加载jQuery。因此，当您尝试使用$时，未定义$。

此外，您的屏幕截图未显示与您的示例相同的标记。

Google Chrome上出现“未捕获的ReferenceError：$未定义”错误（但适用于Firefox和Safari）

1 个答案: