当ajax查询正在进行时，jQuery .load不起作用

Question

I have a web application that loads different content into the same div (.content) using either an ajax request or a .load() request.

A simplified version of the ajax request is:

    $(document).on('click', '.button1', function() {
        $.ajax({
        type: "POST",
        url: "/path/to/file/ajax.php",
        data: {
            'param1': 'xyz',
            'param2': '123',    
        },
        timeout: 10000,
        dataType: "json",
        success: function(data) {
            if (data.status == 'Success') {
                $('.content').html(data.result);
            } else if (data.status == 'Error'){
                console.log('Something went wrong')
            }
        },
        error: function(x, status, error) {
            if (status === "timeout") { 
               console.log('Request Timed Out');
            } 
        },
        }); 
    });

on another button I have:

    $(document).on('click', '.button2', function() {
          $('.content').load('/path/to/file/getContent.php?ref=foo');
    });

The problem is that if I click on button1, and then click on button 2 whilst the ajax request is still executing, nothing happens. (ie. getContent.php doesn't seem to return anything for anywhere between 15-30 seconds)

Clicking on button 2 returns the results instantly, but as soon as button1 is clicked and the ajax request is being processed, it seems to "stall" the entire web app until it's completed (or errors).

(I've also tried using the abort() method to cancel the ajax request, but the same problem persists, even when the abort is successful).

UPDATE See solution/Answer below

Answer 1

Following on from the tip from @adeneo, I did some more research into session_start and ajax calls which led me to this article:

http://konrness.com/php5/how-to-prevent-blocking-php-requests/

The problem absolutely was to do with session_start locking the session file which causes back-end issues with multiple ajax requests. Following the advice in the article above, I made use of session_write_close() in my PHP and everything is working great.

If it helps anyone else, I actually changed my code from session_start() to:

    if (session_status() == PHP_SESSION_NONE) {
       session_start();
       session_write_close();
    }

This makes session variables readable, but no longer locks the session file causing ajax request delays. (It also checks to make sure session_start() hasn't already been called)