Javascript 如何对已加载到另一个html文档中的html文档使用jquery？

我有一个heading.html文件正在加载到我的index.html中

heading.html

<header id="header">


 <div class="logo"></div>

 <nav>

  <a href="#home" class="slide-section">Home</a>
  <a href="#about-me" class="slide-section">About Me</a>
  <a href="#why-me" class="slide-section">Why Me?</a>
  <a href="#contact" class="slide-section">Contact</a>

</nav>

</header>

正如你所看到的，我试图弹出一个警报，只是为了测试它是否工作，但它没有

---

是否有一种方法可以让我在这些正在加载的html文件上使用其他函数。

当您像这样绑定事件时，

$（“.slide section”）。单击（）

，元素还不存在。

.load（）

仍在从服务器抓取内容

但是，您可以在文档中使用

on

方法（委托事件）。它执行一个实时事件附件（即使该元素只在将来存在，也会捕获该事件）

从：

委托事件的优点是可以处理来自 以后添加到文档中的子元素。通过 选择一个元素，该元素保证在 已附加委派事件处理程序，您可以使用委派事件 避免频繁附加和删除事件处理程序。这 元素可以是视图中的容器元素 例如，模型视图控制器设计，或记录事件 处理程序希望监视文档中的所有冒泡事件

另一个建议（如果我可能的话）是从

load

调用中删除

$（function（）{}

。

$（handler）

是的缩写。因此，如果您只调用了一次，就不再需要它们了

因此，我的建议如下：

$( document ).ready(function() {

    $("#includedHeader").load("/assets/_includes/header.html");
    $("#includedFooter").load("/assets/_includes/footer.html");
    $("#includedWhyme").load("/assets/_includes/why-me.html");

});

$(document).on("click", ".slide-section", function(){
    alert('clicked');
});

不要直接使用click（）方法..如果内容不在文档中，则此方法不起作用..使用.on（）方法来指定click方法，其委托的优点是，它们可以处理稍后添加到文档中的子元素中的事件。 因此，从我的角度来看，我使用以下方法-

$(document).on("click", ".slide-section", function(){
    alert('clicked');
});

---

@Lew先生，我现在会试试，我对javascript还不熟悉，所以谢谢你的帮助。

$(document).on("click", ".slide-section", function(){
    alert('clicked');
});