특정 Ajax 콜에서 .ajaxStart()를 호출하는 방법

특정 Ajax 콜에서 .ajaxStart()를 호출하는 방법

사이트 문서에 Ajax 상태에 따라 진행 표시줄을 표시하거나 숨기는 Ajax 호출이 있습니다.

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

기본적으로 이러한 메서드는 빠른 소규모 AJAX 콜이 많이 발생하고 프로그레스 바가 들락날락할 필요가 없는 사이트의 다른 부분에서 오버워딩하고 싶습니다.다른 $.getJ에 첨부하거나 삽입하려고 합니다.SON과 $.ajax 통화입니다.나는 그들을 묶으려고 시도했지만 그것은 좋지 않은 것 같다.

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

2018년 주의:이 답변은 더 이상 사용되지 않습니다. 이 답변에 대해 도움이 될 수 있는 편집을 제안해 주십시오.

사용자 지정 네임스페이스를 사용하여 ajaxStart 및 ajaxStop을 바인딩할 수 있습니다.

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

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

그런 다음 사이트의 다른 부분에서는 .json이 호출하기 전에 일시적으로 바인딩을 해제합니다.

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

답을 찾다가 아이디어를 얻었어요.

에디트: 테스트해 볼 시간이 없었어요.

.ajax()가 global이라고 하는 옵션오브젝트에는 속성이 있습니다.

false로 설정하면 콜의 ajaxStart 이벤트가 트리거되지 않습니다.

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

이를 ajax 액션을 처리하는 함수에 넣으면 적절한 경우에만 바인딩됩니다.

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

로컬 범위 Ajax 이벤트 사용

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

게다가 콜을 디세블로 하는 경우는,.ajaxStart()그리고..ajaxStop(), 를 설정할 수 있습니다.global할 수 있는 선택권false당신의 안에서.ajax()요구;)

자세한 내용은 여기를 참조해 주세요.특정 에이잭스콜로 .ajaxStart()를 호출하는 방법

안타깝게도 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);
    }
 );

나는 해결책을 가지고 있다.showloader라고 하는 글로벌 js 변수를 설정합니다(디폴트로는 false로 설정).로더에 표시하는 함수 중 하나에서는 Ajax 콜을 발신하기 전에 true로 설정합니다.

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

제 머리 부분에는 다음과 같은 내용이 있습니다.

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

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

사용 전: 이렇게 Ajax 호출에서 콜백 함수를 전송하거나 완료합니다.라이브 예는 https://stackoverflow.com/a/34940340/5361795에 있습니다.

소스 샤우팅 코드

수행할 작업을 결정하기 전에 요청을 인터스펙트하려면 ajaxSend 및 ajaxComplete를 사용합니다.답변은 이쪽에서 확인하세요.https://stackoverflow.com/a/15763341/117268

<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.");
});

이 예시를 통해 몇 가지 아이디어를 얻을 수 있습니다.사용자가 Local 클래스의 요소를 클릭하여 Ajax 요청이 전송되면 로그 메시지가 표시됩니다.

언급URL : https://stackoverflow.com/questions/1191485/how-to-call-ajaxstart-on-specific-ajax-calls