jQuery - AJAX load() 메서드
jQuery load() 메서드
jQuery load()메서드는 간단하지만 강력한 AJAX 메서드입니다.
이 load()메서드는 서버에서 데이터를 로드하고 반환된 데이터를 선택한 요소에 넣습니다.
통사론:
$(selector).load(URL,data,callback);
필수 URL 매개변수는 로드하려는 URL을 지정합니다.
선택적 데이터 매개변수는 요청과 함께 보낼 쿼리스트링 키/값 쌍 세트를 지정합니다.
load()선택적 콜백 매개변수는 메소드가 완료된 후 실행할 함수의 이름입니다 .
다음은 예제 파일의 내용입니다. "demo_test.txt":
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
다음 예는 "demo_test.txt" 파일의 내용을 특정 <div>요소에 로드합니다.
예시
$("#div1").load("demo_test.txt");
URL 매개변수에 jQuery 선택기를 추가하는 것도 가능합니다.
다음 예제에서는 "demo_test.txt" 파일 내에서 id="p1"인 요소의 콘텐츠를 특정 <div>요소로 로드합니다.
예시
$("#div1").load("demo_test.txt #p1");
load()선택적 콜백 매개변수는 메소드가 완료 될 때 실행할 콜백 함수를 지정합니다
. 콜백 함수는 다른 매개변수를 가질 수 있습니다.
responseTxt- 호출이 성공하면 결과 콘텐츠를 포함합니다.statusTxt- 통화 상태를 포함합니다.xhr- XMLHttpRequest 객체를 포함
다음 예제에서는 load() 메서드가 완료된 후 경고 상자를 표시합니다. 메서드가 성공 하면 load()"외부 콘텐츠가 성공적으로 로드되었습니다!"가 표시되고 실패하면 오류 메시지가 표시됩니다.
예시
$("button").click(function(){
$("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
jQuery AJAX 참조
모든 jQuery AJAX 메소드에 대한 전체 개요를 보려면 jQuery AJAX 참조 로 이동하십시오 .