>  기사  >  웹 프론트엔드  >  jQuery.ajaxComplete() 함수 사용법에 대한 자세한 설명

jQuery.ajaxComplete() 함수 사용법에 대한 자세한 설명

巴扎黑
巴扎黑원래의
2017-07-03 10:40:061832검색

ajaxComplete() 함수는 AJAX 요청이 완료될 때(성공 또는 실패 여부) 실행될 콜백 함수를 설정하는 데 사용됩니다.

이것은 모든 AJAX 요청의 ajaxComplete 이벤트에 대한 이벤트 처리 함수를 바인딩하는 데 사용되는 전역 AJAX 이벤트 함수입니다. AJAX 요청이 완료되면(성공 또는 실패 여부에 관계없이) ajaxComplete 이벤트가 트리거되고 바인딩된 이벤트 핸들러가 실행됩니다.

이 함수는 jQuery 객체 인스턴스에서 호출되어야 하며, ajaxComplete()는 일치하는 각 요소의 ajaxComplete 이벤트에 핸들러 함수를 바인딩합니다. AJAX 요청이 완료되면 일치하는 모든 요소에 대한 처리 기능이 트리거되고 실행됩니다. 이벤트 핸들러 내의 이는 현재 DOM 요소를 가리킵니다.

동일 요소에서 이 함수를 여러 번 호출하여 여러 이벤트 핸들러를 바인딩할 수 있습니다. ajaxComplete 이벤트가 발생하면 jQuery는 바인딩된 순서대로 바인딩된 이벤트 처리 함수를 실행합니다.

jQuery 1.8부터 이 함수는 document 객체의 ajaxComplete 이벤트에만 핸들러를 바인딩할 수 있습니다. 다른 요소에 바인딩된 이벤트 핸들러는 작동하지 않습니다.

jQuery.ajax() 또는 jQuery.ajaxSetup()에서 옵션 매개변수 global을 false로 설정하면 AJAX 요청이 전역 AJAX 이벤트를 트리거하는 것을 방지할 수 있습니다.

이 함수는 jQuery 객체(인스턴스)에 속합니다.

Syntax

이 함수는 jQuery 1.0의 새로운 기능입니다.

jQueryObject.ajaxComplete(handler)

Parameters

매개변수 설명

handler 함수 유형 이 이벤트가 트리거될 때 실행되어야 하는 이벤트 핸들러 함수입니다.

콜백 함수 핸들러에는 3개의 매개변수가 있습니다. 하나는 현재 이벤트를 나타내는 Event 객체이고, 다른 하나는 현재 AJAX 요청을 보내는 jqXHR 객체이며, 세 번째는 이 AJAX 요청에 대해 설정된 모든 매개변수 옵션입니다(이를 수행하는 옵션 포함). 지정할 필요 없음) 객체 객체(기본 매개변수 옵션 포함).

jqXHR 객체는 jQuery로 캡슐화된 XMLHttpRequest와 유사한 객체입니다.

반환 값

ajaxComplete()함수의 반환 값은 jQuery 유형이며 현재 jQuery 개체 자체를 반환합니다.

예제 및 설명

다음 HTML 샘플 코드를 참조하세요.

<div id="content1">CodePlayer</div>
<div id="content2">专注于编程开发技术分享</div>
<div id="content3">http://www.365mini.com</div>

다음은 ajaxComplete() 함수의 구체적인 사용법을 보여주기 위해 ajaxComplete() 함수와 관련된 jQuery 샘플 코드입니다.

다음 코드 jQuery 1.8 이전 버전을 기준으로 실행됩니다(ajaxComplete()를 통해 설정한 이벤트 핸들러 함수와 $.ajax()의 Complete 옵션을 통해 설정한 콜백 함수의 매개변수가 다르므로 주의하세요).

// 当前 jQuery版本:1.7.2 (必须是1.8之前的版本)
$("div").ajaxComplete( function(event, jqXHR, options){
    alert("处理函数1: 当前元素的id为" + this.id + ",请求的url为" + options.url);
} );
$("div").ajaxComplete( function(event, jqXHR, options){
    alert("处理函数2:请求方式为" + options.type);
} );
// 执行该AJAX请求,会弹出6次对话框
// 因为当前页面有3个div元素,我们为每个div元素绑定了2个事件处理函数
$.ajax( {
    url: "index.html"
} );
// 执行该AJAX请求,会弹出7次对话框
// 因为$.ajax()自己通过complete选项绑定了一个ajaxComplete事件处理函数,这个事件处理函数是绑定在document上的,document只有一个,因此只执行一次
// 当前页面还有3个div元素,我们为每个div元素绑定了2个事件处理函数
// 因此总共弹出7次对话框
$.ajax( {
    url: "myurl" ,
    complete: function(jqXHR, textStatus){
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为:null、&#39;success&#39;、 &#39;notmodified&#39;、 &#39;error&#39;、 &#39;timeout&#39;、 &#39;abort&#39;或&#39;parsererror&#39;等
        
       alert( "ajax()" );
    }
} );

현재 jQuery 버전이 1.8 이상인 경우 위 jQuery 코드는 총 한 번만 대화 상자를 팝업합니다. jQuery 1.8부터 ajaxComplete 이벤트의 핸들러 함수가 문서 객체에 바인딩되어야 적용되기 때문입니다.

따라서 현재 jQuery 버전에 상관없이 특별한 요구사항이 없다면 ajaxComplete 이벤트의 핸들러 함수를 문서 객체에 바인딩해야 합니다.

아아아아

위 내용은 jQuery.ajaxComplete() 함수 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.