1

这是一个关于 jQuery 的问题。

$(document).ready(function() {
    $('li a').click(function(e) {
        e.preventDefault();

        var link = $(this).attr('href');

        location.hash = link;

        $('#content').load(link);
    });
});

当我单击一个链接时,该#contentdiv 会随页面一起加载,并且带有井号标签的名称会附加到 URL 中。

但我希望#contentjQuery 加载的 div 中的每个页面都执行相同的操作。它仅适用于原始内容。

现在我有这个:

$('#content a').click(function(e) {
    e.preventDefault();

    var link = $(this).attr('href');

    location.hash = link;
});

例子:

我已经通过 jQuery 将 donate.php 加载到#contentdiv 中,当我单击 donate.php 上的链接时,它应该将新内容加载到#contentdiv 中。

但它不起作用。

4

4 回答 4

4

答案是事件委托。由于#content元素本身不是动态加载的,因此您希望定位其中的a元素。#content委托元素可能最有意义。尝试这个:

$('#content').on("click", "a", function(e) {
    e.preventDefault();
    var link = $(this).attr('href');
    location.hash = link;
    $('#content').load(link);
});

这样,即使锚元素是动态添加的,它也能正常工作。您可以在.on()文档中阅读更多相关信息,搜索委托事件。


为了进一步解释这一点,上述使用委托的解决方案基本上是说“如果在 内有点击#content,请检查点击是否在a元素内”。a因此,无论该元素在进行此绑定时是否存在,这都将起作用。

这与“将点击处理程序绑定到”不同$('#content a').click(function(e)$('#content a').on("click", function(e)两者都说“将点击处理程序绑定到#content a”,问题在于它无法绑定到#content a在进行此绑定时不存在的一个。

于 2013-09-09T13:50:45.920 回答
1

因为您是在文档就绪事件完成后添加链接。链接不会获得与它们关联的事件处理程序。要使您的链接正常工作,您希望将其与文档相关联并使用on()

$(document).on('click', '#content a', function (e) {
    e.preventDefault();
    var link = $(this).attr('href');
    location.hash = link;
}):
于 2013-09-09T13:50:41.927 回答
0

为此,我们有.on

$(document).on("click", "#content a", function(e) {
    e.preventDefault();
    var link = $(this).attr('href');
    location.hash = link;
});
于 2013-09-09T13:50:16.173 回答
0

.on文档

$('#content').on("click", "a", function(e) {
    e.preventDefault();

    var link = $(this).attr('href');

    location.hash = link;
});

当您添加动态元素时,您必须使用.on为它们编码

于 2013-09-09T13:50:39.977 回答