programing

jQuery. 이해 시

procenter 2023. 2. 11. 17:28
반응형

jQuery. 이해 시

이 기능을 사용하려고 합니다.jQuery.when두 발을 쏘다ajax두 가지 요청이 완료된 후 함수를 호출합니다.제 코드는 다음과 같습니다.

var count = 0;
var dfr;

var showData = function(data) {
    dfr.resolve();
    alert(count);
   // Do something with my data data received
};

var method1 = function() {
    dfr = $.Deferred();

    return $.ajax('localhost/MyDataService/DataMethod_ReturnsData', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: showData
    });
};

var method2 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsCount', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            count = data.d.__count;
        }
    });
};

$.when(method1(), method2())
    .then(showData());

그러나 이것은 예상대로 작동하지 않습니다.Ajax 호출method1에서 사용되는 데이터를 반환한다.showData()Ajax가 전화한다.method2var count에 할당되어 나중에 사용되는 count를 반환합니다.showData().

하지만 위의 코드를 발사하면method1호출을 받고 나서method2그리고 나서.showData데이터를 에 남겨두다showData~하듯이'undefined'. 어떻게 하면 이 작업을 수행할 수 있습니까?$.when내가 알기로는 두 함수가 모두 복귀할 때만 진행이 된다.$.promise실행됩니다.양쪽 Ajax 콜을 병렬로 호출하고 양쪽 콜의 결과에 따라 나중에 결과를 표시해 주었으면 합니다.

function showData(data1, data2) {
    alert(data1[0].max_id);
    alert(data2[0].max_id);
}

function method1() {
    return $.ajax("http://search.twitter.com/search.json", {
        data: {
            q: 'ashishnjain'
        },
        dataType: 'jsonp'
    });
}

function method2() {
    return $.ajax("http://search.twitter.com/search.json", {
        data: {
            q: 'ashishnjain'
        },
        dataType: 'jsonp'
    });
}

$.when(method1(), method2()).then(showData);​

여기 작업 인 jsFiddle이 있습니다.

문제는 네가 합격하고 있다는 거야showData()로.then(),것은 아니다.showData. 함수에 대한 참조를 다음 주소로 전달해야 합니다..then():

$.when(method1(), method2())
    .then(showData);

또는

$.when(method1(), method2())
    .then(function () {
        showData();
    });

편집

작업 데모를 준비했습니다.문제의 일부(적어도 게시한 코드 프래그먼트에는)라는 이름의 콜백 함수가 없다는 것이 있었습니다.$callback문제의 일부분은$콜백 이름으로'$callback'.

이 경우 를 삭제합니다.jsonp: '$callback'jQuery가 디폴트 콜백 함수로 설정되도록 하기 위해 ajax 옵션을 지정합니다.callback 이름으로 함수를 정의하면 모두 동작합니다.

당신의 코드를 조금 수정해서 알기 쉽게...테스트 안 해봤으니까 한번 해봐

var count = 0;
function countResponse(data) {
    count++;
    if(count==2)
    {
        // Do something after getting responce from both ajax request
    }
};

var method1 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsData', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            countResponse(data)
        }
    });
};

var method2 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsCount', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            countResponse(data)
        }
    });
};

언급URL : https://stackoverflow.com/questions/5280699/jquery-when-understanding

반응형