>웹 프론트엔드 >JS 튜토리얼 >Ajax 페이지 비새로고침 구현에 대한 자세한 설명(코드 포함)

Ajax 페이지 비새로고침 구현에 대한 자세한 설명(코드 포함)

php中世界最好的语言
php中世界最好的语言원래의
2018-04-04 17:35:582974검색

이번에는 새로 고침 없이(코드 포함) Ajax 페이지에 대한 자세한 설명을 가져오겠습니다. 새로 고침 없이 Ajax 페이지에 대한 주의사항은 무엇인가요?

ajax(ajax 개발)

AJAX는 "Asynchronous Javascript And XML"(Asynchronous JavaScript and XML)의 약자로, 대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술을 말합니다.

AJAX = 비동기 JavaScript 및 XML(표준 범용 마크업 언어의 하위 집합).

AJAX는 빠르고 동적인 웹 페이지를 만드는 기술입니다.

AJAX를 사용하면 백그라운드에서 서버와 소량의 데이터를 교환하여 웹페이지를 비동기적으로 업데이트할 수 있습니다. 이는 전체 페이지를 다시 로드하지 않고도 웹페이지의 일부를 업데이트할 수 있음을 의미합니다.

AJAX를 사용하지 않는 기존 웹페이지에서는 콘텐츠를 업데이트해야 하는 경우 전체 웹페이지를 다시 로드해야 합니다.

요즘 대부분의 웹사이트에서는 Ajax를 사용하여 페이지 새로고침 작업을 수행합니다.

새로 고침 없음: ajax는 페이지와 배경 간의 데이터 상호 작용을 실현할 수 있습니다. 이는 AJAX의 새로 고침이 전혀 느껴지지 않습니다.

ajax 메소드 구현:

각 페이지에서 호출을 용이하게 하기 위해 ajax를 캡슐화할 수 있습니다.

function MyAjax(type, url, callBack, data, dataType, asyncType)
{ 
if (dataType == null) { dataType = "text"; } 
if (asyncType == null) {asyncType = true; } 
$.ajax({ 
type: type, // post或者get 
url: url , //url最好加一个url+Math.random(),这样可以保证每次请求的页面被浏览器视为不同
data: data, //这里是要传递的参数,格式为 data: "{paraName:paraValue}" 
dataType: dataType, //string,xml,script,json,text
async:asyncType, //同步异步true /false 
error: function (XmlHttpRequest, xmlhttp, info) { 
}, 
success: function (result) { 
//回调函数,result,返回值 
callBack(result); 
}, 
}); }

Call: MyAjax('post',"url?id=" + id, DoOK);

지침: async: true는 비동기를 의미합니다. 이 방법은 ajax가 요청을 보낸 후 서버가 반환되기를 기다리는 동안 프런트 데스크가 ajax 블록 뒤에 있는 스크립트를 계속 실행한다는 것을 의미하며, 이는 서버가 열기와 동일한 올바른 결과를 반환할 때까지 실행되지 않습니다. ;false는 동기화를 의미합니다. 즉, 프런트엔드는 실행하기 전에 서버가 데이터를 반환할 때까지 기다립니다.

이 기사의 사례를 읽은 후 방법을 마스터했다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 자료:

AJAX의 XMLHttpRequest 객체 사용에 대한 자세한 설명

ajax는 서버와 브라우저 간의 긴 연결을 어떻게 실현합니까?

위 내용은 Ajax 페이지 비새로고침 구현에 대한 자세한 설명(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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