Question

我在链接点击时进行了AJAX调用，但每次点击时，它都会跳起几百个像素（不是页面顶部。我在这里做错了什么？

// Handle gallery nav click
$('.gallery-nav-buttons a').click(function(e) {
    e.preventDefault();
    updateImages('#image-container', $(this).attr('href'));
    return false;
});


function updateImages(div, url) {

    // Show loader
    $('.gallery-loader').show();

    // Delete current images and hide div
    $(div).empty();
    $(div).hide();

    // Get Json
    getJsonImages(url).then(function(data){

        // For each image, render HTML and append to div
        data.data.forEach(function(image) {

            // Append to images div
            var html = constructImageHTML(image);
            $(div).append(html);

            // Hide loader
            $('.gallery-loader').hide();

            // Show image div
            $(div).fadeIn(1000);

        });

        // Set prev link
        if (typeof(data.links.prev) != "undefined") {
            $('.gallery-nav-prev').attr('href', data.links.prev);
            $('.gallery-nav-prev').removeClass('disabled');
        } else {
            $('.gallery-nav-prev').addClass('disabled');
        }

        // Set next link
        if (typeof(data.links.next) != "undefined") {
            $('.gallery-nav-next').attr('href', data.links.next);
            $('.gallery-nav-next').removeClass('disabled');
        } else {
            $('.gallery-nav-next').addClass('disabled');
        }

        return false;
    });
}

function getJsonImages(url) {

    return $.ajax({
        url: url,
        dataType: 'json',
        type: 'GET'
    });

}

Answer 1

在ajaxstop（）或ajax调用的成功函数中添加以下代码

   $(div).empty();
   $(div).hide();

链接点击后的页面跳转 - jQuery AJAX调用

1 个答案: