Ajax json timeout/должен быть более эффективным

Question

Я создаю интерактивную карту. Я не буду вдаваться в подробности. Но идея состоит в том, что пользователь нажимает на год (хранится в вар CURRENTYEAR), а затем нажимает на страну (имя хранится в вар thenameonly), а затем следующий Ajax работает с использованием как ВАР:

$.ajax({ 
    async: false, 
    url: url, // JQuery loads content.json 
    contentType: "application/json", 
    dataType: 'json', 
    timeout: 100000, 

    success: (function(data) { 
     alert('success'); 
     $.each(data[thenameonly], function() { 
      $.each(this[currentyear], function() { 
       if(this.pol_type == 'images/gov_icon.svg'){ 
        govcount++; 
       } else if(icon == 'images/stock_x_icon.svg'){ 
        stockcount++; 
       } 
      }); 
     }); 
    }),//SUCCESS 

    complete: (function(){ 
     alert('complete'); 
     $(".gov_numb").html(govcount); 
     $(".stock_numb").html(stockcount); 
    }),//COMPLETE 

    error: function(jqXHR, textStatus, errorThrown) { 
     console.log(JSON.stringify(jqXHR)); 
     console.log("AJAX error: " + textStatus + ' : ' + errorThrown); 
    }//ERROR 

}); 

Он работает для в то время как пользователь продолжает нажимать (иногда в той же стране в том же году, выполняя тот же запрос), в конечном итоге функция успеха задерживается, иногда примерно за 5 секунд до запуска.

Это был тайм-аут, но я увеличил это, потому что полная функция работала до успеха, что вызывало другие проблемы.

Вот файл JSON для справки

{ 
"argentina": [ 
      { 
       "2004": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 


       "2006": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2008": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ] 
      } 
], 


"australia": [ 
      { 
       "1998": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ],     
       "2001": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 
       "2004": [ 
        { 
         "pol_type":"images/stock_x_icon.svg", 
         "policy":"pol info" 
        } 
       ], 
       "2006": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        }, 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2007": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2010": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        }, 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        }, 
        { 
         "pol_type":"images/stock_x_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2011": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2013": [ 
        { 
         "pol_type":"images/gov_icon.svg", 
         "policy":"pol info" 
        } 
       ], 

       "2014": [ 
        { 
         "pol_type":"images/stock_x_icon.svg", 
         "policy":"pol info" 
        } 
       ] 
      } 
     ] 
    } 

У меня есть много других стран и политики и т.д., чтобы добавить, так что я боюсь, что моя структура собирается привести к его поломке полным.

Любая помощь будет оценена!

Карл

Answer 1

Вы должны предотвратить повторные вызовы AJAX отправки, поэтому добавьте в код флагом loading. Вы можете добавить его в глобальную область или закрыть в определённом определении функции:

if(!loading){ 
loading = true; 
$.ajax({ 
async: false, 
url: url, // JQuery loads content.json 
contentType: "application/json", 
dataType: 'json', 
timeout: 100000, 

success: (function(data) { 
    alert('success'); 
    $.each(data[thenameonly], function() { 
     $.each(this[currentyear], function() { 
      if(this.pol_type == 'images/gov_icon.svg'){ 
       govcount++; 
      } else if(icon == 'images/stock_x_icon.svg'){ 
       stockcount++; 
      } 
     }); 
    }); 
    loading = false; 
}),//SUCCESS 

complete: (function(){ 
    alert('complete'); 
    $(".gov_numb").html(govcount); 
    $(".stock_numb").html(stockcount); 
    loading = false; 
}),//COMPLETE 

error: function(jqXHR, textStatus, errorThrown) { 
    console.log(JSON.stringify(jqXHR)); 
    console.log("AJAX error: " + textStatus + ' : ' + errorThrown); 
    loading = false; 
}//ERROR 

}); 
}