목차
- ajaxComplete() 예제 - AJAX 요청 완료 시, 실행할 함수 지정
- ajaxComplete() 정의
- ajaxComplete() 구문
ajaxComplete() 예제 - AJAX 요청 완료 시, 실행할 함수 지정
test.txt 내용
홈짱닷컴 Homzzang.com
test.php 내용
<!DOCTYPE html>
<html>
<head>
<style>
#wait {
display:none;width:69px;height:89px;border:1px solid black;
position:absolute;top:50%;left:50%;padding:2px;
}
#wait img {
width:64;
height:64;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(document).ajaxStart(function(){
$("#wait").css("display", "block");
});
$(document).ajaxComplete(function(){
$("#wait").css("display", "none");
});
$("button").click(function(){
$("#txt").load("test.txt");
});
});
</script>
</head>
<body>
<div id="txt"><h2>여기는 어디?</h2></div>
<button>알려줘.</button>
<div id="wait"><img src='demo_wait.gif'><br>로딩 중</div>
</body>
</html>
ajaxComplete() 정의
AJAX 요청이 완료될 때 실행할 함수를 지정.
1.
jQuery 1.8부터 이 메소드는 document 선택자에만 첨부해야 함.
2. cf.
- ajaxSuccess() - 지정 함수가 요청 완료 성공해야 실행됨.
- ajaxComplete() - 지정 함수가 요청 완료되면 성공 못해도 실행 됨.
ajaxComplete() 구문
$(document).ajaxComplete(function(event,xhr,options))
[매개변수]
function (event, xhr, options)
필수. 요청 완료될 때 실행할 함수 지정.
- event- 이벤트 객체를 포함.
- xhr- XMLHttpRequest 객체를 포함.
- options - AJAX 요청에 사용 된 옵션을 포함.
