apache 在本地主机上查看页面时 jQuery 脚本不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2166689/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery script not working when page viewed on localhost
提问by Steve Stepp
I'm just starting to playing around on a Mac for the first time and I have created a very simple HTML page that uses jQuery to do a simple text swap when an h1 tag is clicked.
我刚开始第一次在 Mac 上玩，我创建了一个非常简单的 HTML 页面，当单击 h1 标签时，该页面使用 jQuery 进行简单的文本交换。
When I don't view the page through the webserver and just open it directly in Safari (file:///Applications/xampp/xamppfiles/htdocs/test/mypage.html) it works as expected. However, when I try to view through Apache (http://localhost/test/mypage.html) it doesn't work.
当我不通过网络服务器查看页面而直接在 Safari (file:///Applications/xampp/xamppfiles/htdocs/test/mypage.html) 中打开它时，它会按预期工作。但是，当我尝试通过 Apache ( http://localhost/test/mypage.html)查看时，它不起作用。
Here's the code:
这是代码：
<html>
<head>
<title>My Awesome Page</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" charset="utf-8">
function sayHello()
{ $('#foo').text('Hi there!');
}
</script>
</head>
<body>
<h1 id="foo" onclick="sayHello()">Click me!</h1>
</body>
</html>
Am I missing something on the Mac? Wouldn't be an Apache setting since its client-side code.. right?
我在 Mac 上遗漏了什么吗？不会是 Apache 设置，因为它的客户端代码......对吗？
I should probably also mention that I loaded XAMPP to run Apache and MySQL. I have tested Apache to ensure its working using a simple PHP file.
我可能还应该提到我加载了 XAMPP 来运行 Apache 和 MySQL。我已经测试了 Apache 以确保它使用一个简单的 PHP 文件工作。
Steve
史蒂夫
采纳答案by Donny Kurnia
Use Firebug and access the page. One things that might be a culprit is that the web server cannot open jquery.js file because of file permission. Firebug will show if the jquery loaded in page, even you can add the jQuery code on-the-fly in the Console tab.
使用 Firebug 并访问该页面。可能是罪魁祸首的一件事是，由于文件权限，Web 服务器无法打开 jquery.js 文件。Firebug 将显示 jquery 是否加载到页面中，即使您可以在控制台选项卡中即时添加 jQuery 代码。
If you access it using Safari, use Web Inspector and see the if any error showed in Console tab.
如果您使用 Safari 访问它，请使用 Web Inspector 并查看控制台选项卡中是否显示任何错误。
One last thing, make a habit to avoid onclick, do this instead:
最后一件事，养成避免的习惯onclick，改为这样做：
<script type="text/javascript" charset="utf-8">
function sayHello()
{
$('#foo').text('Hi there!');
}
//wait DOM loaded
jQuery(function($){
$('#foo').click(function(){
sayHello();
});
});
</script>
Also, it's better to put the js code near the page end, before </body>, so it would not block concurrent page element's loading.
此外，最好将 js 代码放在页面末尾附近， before </body>，这样它就不会阻止并发页面元素的加载。
