使用AJAX编写内部链接

Question

我正在尝试编写一些我的第一个 jquery 脚本，但遇到了一些问题...... 我的页面有很长的文本，有很多内部链接（ Foo ）。我希望当您单击其中一个 .internal 链接时，href 路径将在

内打开。

var InternalLink = function() {
    $(".internal").click(function(){
        var path =  $(this).attr("href");
        $.ajax({
            url: "path",
            success: function(data) {
                $('#article').html(data);
            }
        });
    });    
};

我编写了如下所示的代码，它工作得很好，但我试图将代码推广到具有内部类的每个链接：

$("#article_01").click(function(){
    $.ajax({
        url: 'contents/article_01.htm',
        success: function(data) {
            $('#article').html(data);
        }
    });
});

Answer 1

<a href="/contents/Foo.htm" class="internal" data-ref="article_01">Foo</a>

JS：

$(".internal").click(function(){
    var path =  this.href;
    var div = $(this).data('ref');
    $.ajax({
        url: path,
        success: function(data) {
            $('#'+div).html(data);
        }
    });
    return false; // so the link does *not* follow through
});    

所以现在您所要做的就是更改 data-ref 以指向您希望 html 加载到其中的 div。