Question

我正在处理2个文件。第一个文件是主页面，它使用.load（）来显示第二个文件。 Safari在第一页上运行jquery就好了，但它似乎没有在通过.load（）检索的文件中运行jquery。我尝试将alert（）作为

中的第一行

$(document).ready(function(){});

它只是不在Safari中运行。

在Chrome中，所有jquery都按预期运行。可能导致这种情况的任何线索？

编辑：这是我遇到的问题的一个小例子：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#loadStuffHere').load('example1b.html');
        });
    </script>
</head>
<body>
    <div id="loadStuffHere"></div>
</body>
</html>

这是第二页（example1b.html）：

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#test').click(function() {
                alert("This code executes in Chrome but not Safari.");
            });
        });
    </script>
</head>
<body>
    <p id="test">This is what is being loaded</p>
</body>
</html>

Answer 1

我认为您的主要问题源于将整个HTML页面<html>，<head>加载到您的div中。如果按字面意思起作用，那么在加载后你最终会得到这样的页面结构：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#loadStuffHere').load('example1b.html');
        });
    </script>
</head>
<body>
    <div id="loadStuffHere"><html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#test').click(function() {
                alert("This code executes in Chrome but not Safari.");
            });
        });
    </script>
</head>
<body>
    <p id="test">This is what is being loaded</p>
</body>
</html></div>
</body>
</html>

...这显然是一个非常无效的HTML文档，包含多个<html>，<body>和<head>元素。

load()通常用于将HTML的片段加载到页面的元素中，因此您最终会得到一个仍然有效的HTML整体页面。

浏览器通常可以防止在将HTML加载到页面时结束无效文档，就像它们在页面中解析错误的HTML以尽可能地利用它们一样。

在这种情况下，我猜测Safari可能会处理您尝试将布局拖拽到页面中的方式与Chrome不同 - 例如，它可能会忽略{{1}中的<script>因为它在第二个<head>中，所以它已经看到了其中之一。

请记住，<head>元素不必位于HTML文档的<script>中;它们也可以添加到页面<head>的任何位置。

最后，您还不需要在加载的片段中加载jQuery - 您将代码插入到已经加载了jQuery的页面中，因此您加载的脚本无论如何都可以访问它。

Safari jquery兼容性

1 个答案: