javascript - jQuery 仅适用于 Firefox,不适用于 Chrome 或 IE

标签 javascript jquery html

我正在尝试使用 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>

源页面.html

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

最佳答案

如果使用离线页面,Chrome(即我不知道)不支持读取本地文件。您可以通过三种方式进行检查:

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

    在 Windows 上:

    chrome.exe –允许从文件访问文件

    在 Mac 上:

    打开/Applications/Google\Chrome.app/--args --allow-file-access-from-files

  3. 更改您的代码:

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

关于javascript - jQuery 仅适用于 Firefox,不适用于 Chrome 或 IE,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41522181/

相关文章:

html - 有没有办法在 CSS 中将值引用为 "variables"?

javascript - 通过javascript函数使多个具有相同类的div同时工作

javascript - 来自数组 typescript 的可观察值

javascript - 使用 Javascript 获取 Canvas 中的最大字体大小

javascript - 如何使用 select2 或任何其他 js 在 select 中搜索选项值

html - Chrome 错误 : css positioning incorrectly resizing container

javascript - 我可以在javascript中将整个数组插入到其他数组位置吗?

jquery - 通过循环获取所有元素值

jquery - CSS/jQuery 库来近似 Google News UI 的外观和感觉?

javascript - 在 HTML Canvas 上绘制自相交多边形