Question

我正在尝试编写一些我的第一个jquery脚本，但是我遇到了一些问题...... 我的页面有很长的文本，内有很多链接（ <a href="/contents/Foo.htm" class=.internal>Foo</a> ）。我希望当你点击其中一个.internal链接时，href路径将在<div id="article">内打开。

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。

用AJAX写内部链接

1 个答案: