时间戳

首页 > 解决方案 > 是否可以加载所有功能正常工作的 html 文件？

javascript - 是否可以加载所有功能正常工作的 html 文件？

问题描述

我正在使用两个不同的 html 文件，作为模板工作的索引，我在其中加载其他 html 文件，例如登录面板、购物车和显示（显示产品的位置），我正在使用 jQuery 专门的 ready 方法，它工作正常，直到我尝试添加一个带有 js 的滑块，当我直接加载显示文件时它也可以完美工作，问题是滑块应用于显示文件但是当我用 jQuery 加载它时它只是加载它而没有任何它的功能有效，我试图尽可能清楚，我会分享一段代码，我希望你们知道发生了什么。

jQuery:

function loadDisplay(){
  $(document).ready(function(){
    $("div.body-wrapper").load("display.php")
  });
}

HTML:

  <body onload="loadDisplay()">
    <div class="container">
      <div class="body-wrapper"></div>

JavaScript:

var slideIndex = 0;
function slider(){
    let i;
    let x = document.getElementsByName("bloc-one");

    for (i = 0; i < x.length; i++) {
      x[i].style.display = "none";
    }
    slideIndex++;
    if (slideIndex > x.length) {slideIndex = 1}
    x[slideIndex -1].style.display = "block";
    setTimeout(slider,3000);
  }

总之，方法和函数工作正常，直到文件加载到停止工作的索引文件中。

标签： javascripthtmljquery

解决方案

您的 html 文件有<body>，但您正在将此文件加载到已经存在的正文中。这是第一个问题。其次，您的 html 文件似乎在loadDisplay()加载时执行，但是当它通过 jquery 加载时没有onload触发事件。

所以，你需要的是删除<body>和</body>标签，并在文件的最后尝试添加这个 javascript：

<script>
loadDisplay()
</script>

推荐阅读