使用jquery.load（）加载div

Question

我创建了一个网页，并使用load（）函数加载固定div上的页面。但是在连续点击不同链接时...整个网页都停止响应。

这是我加载页面的代码：

$( document ).ready( function() {  

        $('a').bind('click' , function( e ) {
            e.preventDefault();   // prevent the browser from following the link
            e.stopPropagation();  // prevent the browser from following the link

            $( '#part1' ).load( $( this ).attr( 'href' ) );
        });
    });

当我点击上述load（）函数的链接时，我也想更改url。

Answer 1

通过不断点击你正在添加一堆在后面运行的同步请求。他们都需要处理。因此，浏览器将其内容添加到#part1并在每次请求返回时呈现它。这可能是页面没有响应的原因。

修改

您可以显示一个指示符，让用户知道他正在做某事并阻止再次执行加载。以下示例显示了在加载零件时阻止执行加载。

$( document ).ready( function() {  
    var isLoading = false;

    $('a').bind('click' , function( e ) {
        e.preventDefault();   // prevent the browser from following the link
        e.stopPropagation();  // prevent the browser from following the link
        if(!isLoading){
           //start loading
           isLoading = true;
           $( '#part1' ).load( $( this ).attr( 'href' ), function(response, status, xhr) {
               //this is the callback method for success or failure
               //stop loading
               isLoading = false; 
           });
        }
    });
});

指标的显示/隐藏不应该难以添加。开始加载时显示，停止加载时隐藏。