jQuery와 Scope - 함수 밖의 $ ('# 요소')

저는 jQuery와 Ajax와 관련하여 다소 혼란 스럽습니다.

스크립트 시작 :

$(document).ready(function() { 
     var page = 'index'; 
     displayContent(page) 
});

displayContent는 텍스트 내용을 가져 와서 '#textCotnent'DIV로를 밀어하는 AJAX 호출이 포함되어 있습니다.

함수 I alert ($ ('# textContent'). text()) 내에서 텍스트를 올바르게 경고합니다.

function displayContent(page) { 
     $.ajax(//ajax stuff goes here and works fine); 
     alert($('#textContent').text()) //alerts the text, hooray. 
}

그러나, 다음 작업을 수행 할 경우 :

$(document).ready(function() { 
     var page = 'index'; 
     displayContent(page) 
     alert($('#textContent').text()); //alerts a blank box, boo. 
});

텍스트가 아약스 호출 당 표시되지만 경고가 null를 나타납니다.

$ ('# textContent')는 스크립트에서 어디에서 호출했는지에 관계없이 괜찮을 것이라고 추측 하겠지만,이 경우는 아닙니다.

jQuery에 대해 이해할 수없는 내용은 무엇입니까?

출처

2011-08-16 Tom Thorogood

Ajax 콜백을'displayContent' 안에 넣으면 alert ($ ('# textContent'). text())'를 넣지 않겠습니까? 대부분 jQuery 문제가 아니지만 응답이 반환되기 전에 'alert'을 호출하고 있습니다. –

다시 확인하겠습니다. 하지만 제 질문은 같습니다. 왜 중요할까요? –

jQuery/javascript가 비동기 적으로 실행되므로 원하는 동작을 수행 할 수 있도록 콜백을 사용해야합니다. –

비동기 적으로으로 ajax 호출이 수행되고 있습니다. 호출에서 DOM을 조작/액세스하려면 콜백 함수 ($.ajax)가 나올 때까지 기다려야합니다. 나는 원래 구조가 작동하고 놀랍다. 그것의

function displayContent(page) { 
    $.ajax(/* ajax parameters */).complete(function() { 
    alert($('#textContent').text()) //alerts the text, hooray. 
    }); 
}

생각해이 방법 : 다음과 같은 구조를 사용한다 $.ajax 기능 (2-3 밀리 초) 즉시 반환 코드가 계속 실행됩니다. 서버에 도달하는 데 약 100ms가 걸립니다. 따라서 총을 들고 점프하고 결과를 가지고 놀기 전에 아약스가 완료 될 때까지 기다려야합니다. 이게 말이 돼?

출처

2011-08-16 23:47:24 ghayes

또는 success : functionName 또는 success : function() {...}을 ajax 매개 변수에 추가하십시오. http://api.jquery.com/jQuery.ajax/ – Jacksonkr

gHayes - 이것은 의미가 있으며, 나는 당신이 말하는 것을보고 있습니다. 나는 .complete() 메소드에 대해 몰랐다. 지금 스크립트를 재구성하여 예상되는 동작을 얻는 방법을 알고 있다고 생각합니다. 잭슨 - 나는 성공 패러미터에서 경고를 받았다.이것이 바로 그곳에서 일하는 이유입니다.하지만 국제 통화에서는 그렇지 않습니다. –

Ajax 호출은 대부분 비동기식이므로 호출은 Ajax 호출이 시작된 직후이지만 Ajax 호출이 응답을 반환하기 전에 발생합니다. 코드의

타임 라인 :

displayContent(page); 
$.ajax(etc...); //Ajax call is sent 
alert($('#textcontent').text()); // At this point, your #textcontent element is empty 
//Sometimes later, the ajax call returns

출처

2011-08-16 23:47:53 red

AJAX 호출이 비동기. 따라서 AJAX 요청이 전송되는 동안 나머지 코드가 실행됩니다.

첫 번째 예제에서와 같이 AJAX 요청이 완료되면 함수를 호출해야합니다.

출처

2011-08-16 23:52:52 adamjmarkham

jQuery와 Scope - 함수 밖의 $ ('# 요소')

답변

관련 문제