javascript-在localhost上查看页面时jQuery脚本不起作用

前端之家收集整理的这篇文章主要介绍了javascript-在localhost上查看页面时jQuery脚本不起作用 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我刚刚开始在Mac上玩,并且创建了一个非常简单的HTML页面,当单击h1标签时,该页面使用jQuery进行了简单的文本交换.

当我不通过网络服务器查看页面而只是直接在Safari中打开页面时(file:///Applications/xampp/xamppfiles/htdocs/test/mypage.html),它会按预期工作.但是,当我尝试查看Apache(http://localhost/test/mypage.html)时不起作用.

这是代码

<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>

我在Mac上缺少什么吗?因为它的客户端代码,所以不会是Apache设置.

我可能还应该提到我加载了XAMPP来运行Apache和MysqL.我已经测试过Apache,以确保使用简单的PHP文件即可正常工作.

史蒂夫

最佳答案
使用Firebug并访问该页面.可能的罪魁祸首是Web服务器由于文件许可权而无法打开jquery.js文件. Firebug将显示是否在页面中加载了jquery,即使您可以在Console(控制台)选项卡中即时添加jQuery代码.

如果使用Safari访问它,请使用Web Inspector并查看“控制台”选项卡中是否显示任何错误.

最后一件事,养成避免onclick的习惯,改为这样做:

<script type="text/javascript" charset="utf-8">
  function sayHello()
  {
    $('#foo').text('Hi there!');  
  }
  //wait DOM loaded
  jQuery(function($){
    $('#foo').click(function(){
      sayHello();
    });  
  });
</script>

此外,最好将js代码放在< / body>之前的页面末端附近,以免阻塞并发页面元素的加载.

猜你在找的HTML相关文章