Question

我有一个jQuery脚本，其中包含一个include文件夹中的.html文件到我的index.html，它运行得很好。

var includes = $('[data-include]');
jQuery.each(includes, function(){
  var file = 'includes/' + $(this).data('include') + '.html';
  $(this).load(file);
});

当我尝试包含相同的.html文件时遇到了问题，但这次我在子页面文件夹中试图获得相同的结果，但没有包含任何内容。

文件夹结构：

index.html
assets
includes
   -login.html
   -header.html
subpages
   -contact.html

的index.html

        <!-- Include search-bar.html -->
        <section class="login" data-include="login"></section>

        <!-- Include header.html -->
        <header class="logo" data-include="header"></header>

        <script type="text/javascript" src="assets/lib/js/jquery-3.1.1.min.js"></script>
        <script type="text/javascript" src="assets/js/script.js"></script>

contact.html

        <!-- Include search-bar.html -->
        <section class="login" data-include="login"></section>

        <!-- Include header.html -->
        <header class="logo" data-include="header"></header>

        <script type="text/javascript" src="../assets/lib/js/jquery-3.1.1.min.js"></script>
        <script type="text/javascript" src="../assets/js/script.js"></script>

Answer 1

要相对于根目录，请使用/

启动URI

var file ='/ includes /'+ $（this）.data（'include'）+'。html';

试一试。

使用jQuery包含来自不同文件夹的.html文件

1 个答案: