Question

我正在尝试使用jQuery导入HTML文件：

$('#section1').load('section1.html');

问题是当加载代码时jQuery不能正常工作。在这个HTML里面我有一些jQuery UI和一些复选框，如果我不使用“加载”功能工作，但是如果我导入它，它们就不会被识别。

Answer 1

确保文件路径正确。如果使用相对路径，请确保将文件放在正确的位置。

我的工作范例：

的test.html：

<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
    </head>
    <body>
        <h1>
            Test Header
        </h1>
        <div id="place_holder"></div>
    </body>
    <script>
        $(document).ready(function() {
          $('#place_holder').load("load_me.html");
        });
    </script>
</html>

load_me.html：放置在与test.html相同的位置

<h2>Loaded from another file</h2>

您不必进行内联Javascript。您可以加载执行相同操作的external JavaScript文件。

Answer 2

最后我想出了如何解决这个问题。我尝试使用PHP而不是Jquery加载函数来包含其他HTML文件。

我用PHP扩展名重命名了我的文件，并将其上传到虚拟服务器上，如MAMP或XAMP）。

然后用这个sintax导入我的代码。

<?php  include("your_file_path/your_file_name.html");  ?>

我在主页中包含了一个网站的大部分，而我的其他HTML文件则位于HOMEPAGE的同一个文件夹中。我用了

<?php  include("section6.html");  ?>

使用此方法后，我的所有Jquery库都能正常工作。

使用jQuery导入HTML文件

2 个答案: