jQuery 只能在 Firefox 中运行，不能在 Chrome 或 IE 中运行答案

【问题标题】：jQuery is working in Firefox only, not in Chrome or IEjQuery 只能在 Firefox 中运行，不能在 Chrome 或 IE 中运行
【发布时间】：2017-01-07 13:54:27
【问题描述】：

我正在尝试使用 jQuery 从另一个 html 文件的内容加载 html 文件的一部分。这些代码适用于 Mozilla Firefox，但不适用于 Google Chrome 或 Windows Internet Explorer。在最后两个浏览器中，页面保持原样。我做错了什么？

index.html

<html>
    <head>
        <script src="jquery-3.1.1.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                 $("#clickhere").click(function(){
                     $("#partialdisplay").load("sourcepage.html");
                 });
            });
        </script>
    </head>
    <body>
        <div id="header">
            This is the header.
            <a href="#" id="clickhere">Click here</a>
        </div>

        <div id="partialdisplay">
            <!--Content from other page will be loaded here -->
        </div>

        <div id="footer">
            This is the footer.
        </div>
    </body>
</html>

sourcepage.html

<html>
<head>
</head>
<body>
    <div id="partialdisplay">
        This part will be called back to index.html.
    </div>
</body>
</html>

【问题讨论】：

只将<div id="partialdisplay"> This part will be called back to index.html. </div> 放入您的sourcepage-html 文件
应该可以正常工作...开发工具控制台中是否有任何错误？请注意，您将在页面中拥有重复的 ID
你只是指src="jquery-3.1.1.js"。尝试在src 参考中给出完整的路径，以http://... 开头。
stackoverflow.com/questions/10752055/…
您是否从硬盘测试此代码？或者你正在使用服务器？只有 Firefox 会从您的硬盘加载文件。

标签： javascript jquery html

【解决方案1】：

Chrome（即我不知道）如果使用离线页面，则不支持读取本地文件。您可以通过三种方式查看：

使用网络服务器。
在使用这些命令之前，请务必结束所有正在运行的 Chrome 实例。

在 Windows 上：

chrome.exe –allow-file-access-from-files

在 Mac 上：

打开 /Applications/Google\ Chrome.app/ --args --allow-file-access-from-files
更改您的代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
    <head>
        <script src="jquery-3.1.1.js"></script>
        <script type="text/javascript">
            var  sourcecontent = '<div id="partialdisplay">This part will be called back to index.html.</div>'; 
            $(document).ready(function(){
                 $("#clickhere").click(function(){
                     $("#partialdisplay").html(sourcecontent);
                 });
            });
        </script>
    </head>
    <body>
        <div id="header">
            This is the header.
            <a href="#" id="clickhere">Click here</a>
        </div>

        <div id="partialdisplay">
            <!--Content from other page will be loaded here -->
        </div>

        <div id="footer">
            This is the footer.
        </div>
    </body>
</html>

【讨论】：

【解决方案2】：

Chrome 和其他一些浏览器不允许跨源请求，最重要的是，如果文件的来源不受信任，它就不会加载文件（在您的情况下，这里直接从磁盘加载文件）。您可以通过使用 python 运行一个简单的 http 服务器（使用一些未使用的端口，如 1234）来绕过此安全检查。将文件转移到单独的目录中，然后在其中运行以下命令。

Linux/Mac：

python -m SimpleHTTPServer 1234

窗户：

python -m http.server 1234

您现在可以使用http://localhost:1234 访问您的应用程序。

【讨论】：

可能就是这个原因。有时Chrome也不执行内联脚本，所以将内联代码复制到一个文件中，然后说<script src='mycode.js'>就可以解决问题。