Как звонить .ajaxStart() на конкретной AJAX звонки

Question

У меня есть некоторые Ajax звонки по документу сайта, который отобразить или скрыть индикатор выполнения в зависимости от состояния АЯКС

$(document).ajaxStart(function(){ 
     $('#ajaxProgress').show(); 
    }); 
    $(document).ajaxStop(function(){ 
     $('#ajaxProgress').hide(); 
    }); 

Я хотел бы, чтобы в основном overwirte эти методы на других участках сайта, где сделано много быстрых небольших вызовов ajax, и не нужно, чтобы индикатор выполнения включался и исчезал. Я пытаюсь прикрепить их или вставить их в другие вызовы $ .getJSON и $ .ajax. Я попытался связать их, но, видимо, это нехорошо.

$.getJSON().ajaxStart(function(){ 'kill preloader'}); 

Answer 1

Вы можете связать ajaxStart и ajaxStop используя пользовательское пространство имен:

$(document).bind("ajaxStart.mine", function() { 
    $('#ajaxProgress').show(); 
}); 

$(document).bind("ajaxStop.mine", function() { 
    $('#ajaxProgress').hide(); 
}); 

Затем, в других частях сайта вы будете временно отменяя их перед тем ваш .json называет:

$(document).unbind(".mine"); 

Есть идея от here в поисках ответа.

EDIT: У меня не было времени проверить его, увы.

Answer 2

К сожалению, ajaxStart событие не имеет каких-либо дополнительную информацию, которую вы можете использовать, чтобы решить, следует ли показывать анимацию или нет.

В любом случае, вот одна идея. В вашем методе ajaxStart почему бы не начать анимацию после 200 миллисекунд? Если запросы ajax завершаются за 200 миллисекунд, вы не показываете анимацию, иначе вы показываете анимацию. Код может выглядеть примерно так:

var animationController = function animationController() 
{ 
    var timeout = null; 
    var delayBy = 200; //Number of milliseconds to wait before ajax animation starts. 

    var pub = {}; 

    var actualAnimationStart = function actualAnimationStart() 
    { 
     $('#ajaxProgress').show(); 
    }; 

    var actualAnimationStop = function actualAnimationStop() 
    { 
     $('#ajaxProgress').hide(); 
    }; 

    pub.startAnimation = function animationController$startAnimation() 
    { 
     timeout = setTimeout(actualAnimationStart, delayBy); 
    }; 

    pub.stopAnimation = function animationController$stopAnimation() 
    { 
     //If ajax call finishes before the timeout occurs, we wouldn't have 
     //shown any animation. 
     clearTimeout(timeout); 
     actualAnimationStop(); 
    } 

    return pub; 
}(); 


$(document).ready(
    function() 
    { 
     $(document).ajaxStart(animationController.startAnimation); 
     $(document).ajaxStop(animationController.stopAnimation); 
    } 
); 

Answer 3

Если вы поместите это в функции, которая обрабатывает действия АЯКСА это будет только связывать себя, когда это необходимо:

$('#yourDiv') 
    .ajaxStart(function(){ 
     $("ResultsDiv").hide(); 
     $(this).show(); 
    }) 
    .ajaxStop(function(){ 
     $(this).hide(); 
     $(this).unbind("ajaxStart"); 
    }); 

Answer 4

Кроме того, если вы хотите ограниченных вызовов .ajaxStart() и .ajaxStop(), вы можете установить global вариант false в ваших .ajax() запросов;)

подробнее здесь: How to call .ajaxStart() on specific ajax calls

Answer 5

Используйте ajaxSend и ajaxComplete, если вы хотите пересечь запрос перед тем, как решить, что делать. Смотрите мой ответ здесь: https://stackoverflow.com/a/15763341/117268

Answer 6

<div class="Local">Trigger</div> 

<div class="result"></div> 
<div class="log"></div> 

$(document).ajaxStart(function() { 
$("log")text("Trigger Fire successfully."); 
}); 

$(".local").click(function() { 
$(".result").load("c:/refresh.html."); 
}); 

Just Go через этот пример вы получаете некоторые idea.When пользователь щелкает элемент с классом Local и запрос Ajax посылается, отображается сообщение журнала.

Answer 7

У меня есть решение. Я установил глобальную переменную js, называемую showloader (по умолчанию задано как false). В любой из функций, которые вы хотите показать загрузчику, просто установите значение true, прежде чем вы выполните вызов ajax.

function doAjaxThing() 
{ 
    showloader=true; 
    $.ajax({yaddayadda}); 
} 

Тогда у меня есть следующее в моей голове;

$(document).ajaxStart(function() 
{ 
    if (showloader) 
    { 
     $('.loadingholder').fadeIn(200); 
    } 
});  

$(document).ajaxComplete(function() 
{ 
    $('.loadingholder').fadeOut(200); 
    showloader=false; 
}); 

Answer 8

использование beforeSend или полные функции обратного вызова в Ajax вызова, как этот путь ..... Живого примера здесь https://stackoverflow.com/a/34940340/5361795

Источник ShoutingCode

Answer 9

Использование локального Ajax Событие области видимости

   success: function (jQxhr, errorCode, errorThrown) { 
        alert("Error : " + errorThrown); 
       }, 
       beforeSend: function() { 
        $("#loading-image").show(); 
       }, 
       complete: function() { 
        $("#loading-image").hide(); 
       } 

Answer 10

В объекте options есть атрибут .ajax() принимает глобальный.

Если установлено значение false, это событие не вызовет событие ajaxStart для вызова.

$.ajax({ 
     url: "google.com", 
     type: "GET", 
     dataType: "json", 
     cache: false, 
     global: false, 
     success: function (data) {