자바 스크립트 변수 범위 내에서 아약스 함수

이것은 아마도 어리석은 질문이며 js 범위 질문은 매우 일반적이라는 것을 알고 있지만 어쨌든이 방법을 사용하여 나를 도울만큼 충분히 친절 할 수 있습니까? 여기 자바 스크립트 변수 범위 내에서 아약스 함수

내 기능입니다 :

function checkOpen(storeData) { 
if (storeData.menu === 'true') { 

    var offerImgPath = '/wcsstore/ConsumerDirectStorefrontAssetStore/images/colors/color'+ Brand.styleColour + '/v3/', 
     offer1, 
     offer2; 

    cafeTabContent = '<p>Cafe/Restaurant facilities are available in this store.</p>'; 
    cafeTabContent += '<p class="menu_link"><a href="/store_menus/menu.pdf" target="_blank">Click here to download a menu</a></p>'; 

    if (Brand.storeLocatorSettings.cafeOffersOn === true) { 

     $.ajax({ 
      url : Arcadia.Brand.storeLocatorSettings.offersPageURL, 
      success : function(data) { 
       var offerContainer = $(data).find('#basic_story_content'); 
       offer1 = offerContainer.children(':first-child').attr('src'); 
       offer2 = offerContainer.children(':last-child').attr('src'); 
      } 
     }); 

     console.log(offer1); 

     cafeTabContent += '<p>Current offers:</p>'; 
     cafeTabContent += '<p class="offer_graphic"><img src="' + offer1+ '" alt="Offer 1" /></p>'; 
     cafeTabContent += '<p class="offer_graphic"><img src="' + offer2+ '" alt="Offer 2" /></p>'; 
    } 

    return cafeTabContent; 
} else { 
    return false; 
} 
};

난 데 문제는 offer1 & offer2는 아약스 성공 기능을 외부에서 정의하고 있다는 사실에도 불구하고,이 함수 내에서 적용되는 값이 밖에 유지되지 않는 것입니다 따라서 console.log (offer1)는 이미지 경로 대신 undefined를 반환합니다. 나는 이것이 범위 질문 인 것을 알고 있으며, 그것은 정말로 나를 괴롭 히고있다. 어떤 도움이라도 대단히 감사하겠습니다.

출처

2012-03-20 El Guapo

고마워, 내가 어리 석다는 건 알았어. 당신 모두가 저에게 정확한 답을 주신 것처럼 보았습니다. 나는 그가 처음이었던 것처럼 Ajinkya에게 신용을 보여줄 것입니다. –

인 경우 Ajax A는 비동기를 의미합니다.
그래서 실제 데이터가 반환되기 전에 콘솔 명령문이 실행됩니다. 이는 성공적인 반환 값이 offer1과 offer2에 할당 된 후 그 전에 콘솔에 출력 한 것을 의미합니다. AJAX의 비동기 자연 :
당신은 다른 (하지만 막연하게 관련) 문제를 다루고있는이

$.ajax({ 
      url : Arcadia.Brand.storeLocatorSettings.offersPageURL, 
      success : function(data) { 
       var offerContainer = $(data).find('#basic_story_content'); 
       offer1 = offerContainer.children(':first-child').attr('src'); 
       offer2 = offerContainer.children(':last-child').attr('src'); 
     console.log(offer1); 
     console.log(offer2); 
      } 
     });

출처

2012-03-20 17:20:19 xyz

을보십시오.

코드에서 $.ajax()을 호출하면 해당 요청이 비동기 적으로 실행되고 요청이 전송되면 즉시 코드가 반환됩니다. 따라서 offer1 및 offer2은 아직 정의되지 않았습니다.

정확하게 할 일은 코드를 AYAX 결과에 따라 success 콜백 함수 (또는 콜백에서 호출 한 함수)에 넣는 것입니다.

출처

2012-03-20 17:21:14

범위 문제는 아닙니다. 문제는 아약스 요청이 완료되고 콜백이 호출 될 때까지 (offer1 및 offer2으로 설정), console.log(...)은 이미 오래되었습니다.

console.log('ajax complete');을 콜백에 넣고 사용해보십시오. 마지막으로 호출됩니다.

나머지 콜백 함수를 콜백에 넣기 만하면 해결할 수 있습니다.

출처

2012-03-20 17:21:25 rfunduk

자바 스크립트 변수 범위 내에서 아약스 함수

답변

관련 문제