我怎么知道什么时候ajax加载的内容完成



我正在使用AJAX加载HTML,在主页我有两个div(一个是在左侧称为home-logo,另一个称为home-copy), AJAX将加载内容适合到div home-copy,但每个页面的内容是不同的。我如何获得每个内容的高度,然后将此高度设置为home-copy.height ?

function handleAjax(e) { 
    // get the page we want 
    getPage = $(this).attr('href'); 
    // make AJAX call 
    $.get('ajax.php', {page: getPage}, function(data) { 
        result = $.parseJSON(data); 
        // fill in new page 
        $('#subnav').html(result.subnav); 
        $('#home-copy').html(result.copy);
        // get document height and get rid of 15% minus the height of the boxes and padding 
        docHeight = [$(document).height()-($(document).height()*.15)]-100; 
        // change height of content boxes 
        $('#home-logo').animate({height: docHeight}, 0); 
        $('#home-copy').animate({
            height: docHeight, 
            backgroundColor: 'white', 
            color: 'gray', 
            paddingTop: 50
        }, 0); 
        // fade out the footer 
        $('#footer-row').fadeOut(); 
        // change background 
        //$('#content-area').backstretch(result.background); 
        $('#background img').attr("src",result.background); 
        // clear old nav 
        $('.current_page_item_green').removeClass('current_page_item_green'); 
        $('.current_page_item').removeClass('current_page_item'); 
        // update navigation 
        if (result.nav_color == 'green') { 
            // add green 
            $('.nav-link').each(function() { 
                $(this).addClass('green'); 
            }); 
            $(result.current_page_item).addClass('current_page_item_green'); 
        } else { 
            $('.nav-link').each(function() { 
                $(this).removeClass('green'); 
            }); 
            $(result.current_page_item).addClass('current_page _item'); 
        } 
    }); 
} 

看起来您已经指定了一个在AJAX调用成功时调用的函数。但是,您可能希望使用ajax方法而不是get,因为您在如何处理配置和故障方面获得了更多的粒度。

使用ajax success函数

success: function (dataCheck) {
                // code after success 
                }

或使用done方法,如

示例:将一些数据保存到服务器并在完成后通知用户。

$.ajax({
         type: "POST",
         url: "some.php",
         data: { name: "John", location: "Boston" }
      }).done(function( msg ) 
       {
         alert( "Data Saved: " + msg );
      });

最新更新