javascript - 定位用户点击的特定链接

Question

我有一个充满不同链接的页面，每个链接都有一个类别 .post-link 。

在下面的函数中，我想要行 $(this).html('loading...');针对特定的.post-link被点击的div。我将如何实现这一目标？我觉得我应该创建某种变量，但我有点迷失了。任何帮助将不胜感激。

$('.post-link').click(function(e) {
    e.preventDefault();

    var post_id = $(this).attr('rel');
    var ajaxURL = site.ajaxurl;

    function projectShow() {
        $.ajax({
            type: 'POST',
            cache: false,
            url: ajaxURL,
            data: {'action': 'load-content', post_id: post_id },
            beforeSend: function() {
                $('#project-wrapper').addClass('activated');
                $(this).html('loading...');                     <--line in question
            },
            success: function(response) {
                $('#project-container').html(response);
                $('.post-container').addClass('fadeInUp');
                $('.close-button').addClass('fadeOutDown');
                $('#project-wrapper .entry-title').shuffleLetters();
                return false;
            }
        });
    }

编辑

以下是我的 HTML 的设置方式:

<a class="post-link"><img src="image.jpg"></a>

使用 Alexander 的解决方案，“正在加载...”文本显示如下:

<a class="post-link"><img src="image.jpg">loading...</img></a>

有没有办法让它显示成这样？

<a class="post-link"><span>loading...</span><img src="image.jpg"></img></a>

当然，考虑到我将文本包装在 span 中标签？

更新

$('.post-link').click(function(e) {
    e.preventDefault();


    var post_id = $(this).attr('rel'),
        ajaxURL = site.ajaxurl;

    function projectShow() {
        $.ajax({
            type: 'POST',
            cache: false,
            url: ajaxURL,
            data: {'action': 'load-content', post_id: post_id },
            beforeSend: function() {
                $('#project-wrapper').addClass('activated');
                $('<span class="loading">loading...</span>').insertBefore($(e.currentTarget).find('img'));
            },
            success: function(response) {
                $('.loading').remove();
                $('#project-container').html(response);
                $('.post-container').addClass('fadeInUp');
                $('.close-button').addClass('fadeOutDown');
                $('#project-wrapper .entry-title').shuffleLetters();
                return false;
            }
        });
    }

    if ($(window).scrollTop() != 0) {
        projectShow();
        $('html, body').animate({
            scrollTop : 0
        },100);
    } else {
        projectShow();
    }
});

Answer 1

使用

$('<span>loading...</span>').insertBefore($(e.currentTarget).find('img'));

或

$(e.currentTarget).prepend('<span>Loading</span>'); 

因为beforeSend中的this没有引用元素