Javascript Jquery Ajax在发送加载动画之前

大家好，我的ajax加载动画有一个问题。问题是当我悬停任何图像时，加载动画在所有图像下都处于活动状态

像这样

当我将鼠标悬停在第一个图像上时，我想让它只为该图像激活

。ajax加载

。如果我将鼠标悬停在第二个图像上，则仅第二个图像的

.ajax加载

处于活动状态

有人能帮我吗？ CSS

还有阿贾克斯

$(document).ready(function () {

    function showProfileTooltip(e, id) {
        //send id & get info from get_profile.php 
        $.ajax({
            url: '/echo/html/',
            data: {
                html: response,
                delay: 0
            },
            method: 'post',
            beforeSend: function() {
                $('.ajax-loading').addClass('active');    
            },
            success: function (returnHtml) {
                e.find('.user-container').empty().html(returnHtml).promise().done(function () {
                    $('.the-container').addClass('loaded');
                });
            }
        }).complete(function() {
            $('.ajax-loading').removeClass('active');    
        });

    }

    function hideProfileTooltip() {
        $('.the-container').removeClass('loaded');
    }
    $('.the-container').hover(function (e) {

        var id = $(this).find('.summary').attr('data-id');
        showProfileTooltip($(this), id);

    }, function () {
        hideProfileTooltip();
    });
});

---

问题是，

beforeSend

函数为类

的所有元素激活类
active
。ajax加载

由于您正在将接收悬停的jQuery对象传递给函数，因此可以利用这一点，将类

active

仅添加到下面有类

.ajax load

的元素中

beforeSend: function() {
    $('.ajax-loading',e).addClass('active');// Note the ,e that I added
},

---

希望有帮助。

我没看到。非常感谢。

beforeSend: function() {
    $('.ajax-loading',e).addClass('active');// Note the ,e that I added
},