javascript - 使用 jQuery .load() 加载的页面不响应其他 JavaScript

Question

我使用 .load() 将相同的页面动态加载到 div 中。每个页面的 div 被加载到主页上的两个 Pane 中。有用。我想做的是让 JavaScript 对子页面中包含的链接起作用。子页面上只有一个列表。

链接必须相对于根目录，但以同样的方式链接 JS 文件是行不通的。无论我说 .js 文件位于何处，都不会发生任何情况。只是最初的 .load() 函数。

我是否可以在代码中添加一些内容，或者找到一种方法来找出它在哪里寻找 .js 文件？

这是带有.load()的函数

$(document).ready(function() {
    //#left and #right are divs loading content from .content/.description
    $('#left').load('demos/websites.html .content');
    $('#right').load('demos/websites.html .description');
    $('nav#subnav li a').click(function() {
        var page = $(this).attr('href');
        $('#left').load(page + ' .content');
        $('#right').load(page + ' .description');
        return false;
    });
});

Answer 1

您最好使用事件委托(delegate)。由于 .load() 调用是异步的，因此在尚未收到响应时它们会立即返回，并且 .click() 绑定(bind)仅考虑 DOM 中现有的元素执行的那一刻。

$(document).on('click', 'nav#subnav li a', function() {
  ...
});

从 jQuery 1.7 开始，推荐使用 .on() 方法来执行此操作。