Question

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

链接必须与root相关，但以相同的方式链接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

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

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

从jQuery 1.7开始，.on()是推荐的方法。

Answer 2

看起来像是时间问题。使用load的回调函数来注册click事件。

 $('#left').load('demos/websites.html .content',function() {
       console.log('Left pane loaded');
  });

Answer 3

当您使用带有后缀选择器表达式的.load函数时，您尝试加载的页面中包含的.js文件不会被执行，就好像它们根本不包含在内一样。

那么你有两个选择：

使用.load函数，不带后缀选择器表达式
或者在邮件页面中包含.js文件，然后在加载像这样的内容后执行所需的功能

$（'＃left'）。load（'demos / websites.html .content'，function（）{ //在这里执行你的js函数。 }）;

来自jQuery网站：

脚本执行

使用不带后缀选择器表达式的URL调用.load（）时，在删除脚本之前将内容传递给.html（）。这将在丢弃之前执行脚本块。但是，如果使用附加到URL的选择器表达式调用.load（），则在更新DOM之前会删除脚本，因此不会执行脚本。两种情况的例子如下所示：

此处，作为文档一部分加载到#a中的任何JavaScript都将成功执行。

1. $('#a').load('article.html');

但是，在下列情况下，加载到#b的文档中的脚本块将被删除而不会执行：

1. $('#b').load('article.html #target');

Answer 4

以下是亚历山大实施的建议的完整代码。

 $(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');

  $(document).on('click', 'nav#subnav li a', function() {
    var page = $(this).attr('href');

    $('#left').load(page+' .content');
    $('#right').load(page+' .description');
    return false;

  });
});

但请确保您使用的是jquery 1.7或更高版本。

您的代码无效的原因 - 当您将单击处理程序绑定到链接的语句时，可能链接可能不会在DOM本身加载。

使用jQuery .load（）加载的页面不响应其他JavaScript

4 个答案: