> 웹 프론트엔드 > JS 튜토리얼 > Ajax 종합 애플리케이션 종합 분석

Ajax 종합 애플리케이션 종합 분석

亚连
풀어 주다: 2018-05-23 17:16:47
원래의
1589명이 탐색했습니다.

AJAX = 비동기 JavaScript 및 XML인 AJAX는 빠르고 동적인 웹 페이지를 만드는 기술입니다. 이 기사는 Ajax의 포괄적인 응용에 대한 종합적인 분석을 제공합니다. 매우 훌륭하고 참고할 가치가 있습니다. 관심 있는 친구들은 함께 살펴보세요

AJAX는 "Asynchronous Javascript And XML"(비동기 JavaScript 및 XML)입니다. , 이는 대화형 웹 애플리케이션을 위한 일종의 웹 개발 기술을 의미합니다.

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

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

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

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

•"xml": jQuery로 처리할 수 있는 XML 문서를 반환합니다.

•"html": 일반 텍스트 HTML 정보를 반환합니다. 포함된 스크립트 태그는 DOM에 삽입될 때 실행됩니다.

•"script": 일반 텍스트 JavaScript 코드를 반환합니다. 결과는 자동으로 캐시되지 않습니다. "cache" 매개변수가 설정되지 않은 경우. 참고: 원격 요청(동일한 도메인이 아닌)을 수행하는 경우 모든 POST 요청은 GET 요청으로 변환됩니다. (DOM 스크립트 태그를 사용하여 로드하기 때문입니다.)

•"json": JSON 데이터를 반환합니다.

•"jsonp": JSONP 형식. "myurl?callback=?"과 같은 JSONP 형식을 사용하여 함수를 호출하면 jQuery는 콜백 함수를 실행하기 위해 자동으로 ?를 올바른 함수 이름으로 바꿉니다.

•"text": 일반 텍스트 문자열을 반환합니다.

1. 프런트엔드에서 문자열 변수를 전달하고 백그라운드에서 문자열 변수를 반환합니다(json이 아닌 형식).

여기서는 다음 문제를 해결하기 위해 Ajax 데이터 전송에 나타나는 한자 왜곡된 문자입니다. 문자열이 전달되기 전에 한자 문자열은 JavaScript 함수 escape()를 사용하여 인코딩되고 반환된

문자열은 unescape() 함수를 사용하여 디코딩되어 한자가 표시됩니다. 정상적으로 표시될 수 있습니다. 물론, 배경 PHP 코드는 중국어 문자열이 왜곡되지 않도록 헤더 파일도 추가합니다. 다양한 백엔드 코드는 다음과 같이 한자가 왜곡되는 문제를 해결합니다.

PHP:

header('Content-Type:text/html;charset=GB2312');
로그인 후 복사

 

Javascript 코드:

$(function(){
var my_data="前台变量";
my_data=escape(my_data)+"";//编码,防止汉字乱码
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果调用php成功
alert(unescape(data));//解码,显示汉字
}
});
});
로그인 후 복사

 

PHP 코드:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=$_POST['trans_data'];
echo $backValue."+后台返回";
로그인 후 복사

2. 프런트 데스크 여러 개의 1차원 배열을 전달하고 백그라운드에서 문자열 변수를 반환합니다(json이 아닌 형식). json이 아닌 형식에서는 백그라운드에서 배열을 반환하려는 경우 json을 사용할 수 있습니다. 이 문서의 뒷부분에서 설명할 형식입니다. 자세한 소개.

Javascript 코드:

$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
//dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data,status){//如果调用php成功
alert(data);
}
});
});
로그인 후 복사

PHP 코드:

//读取第一个数组
$backValue="trans_data:";
$trans=$_POST['trans_data'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
//读取第二个数组
$backValue=$backValue." , trans_data1:";
$trans=$_POST['trans_data1'];
foreach($trans as $value)
{
$backValue=$backValue." ".$value;
}
echo $backValue;
로그인 후 복사

3. 프런트엔드에 여러 개의 1차원 배열을 전달하고 2차원 배열을 반환합니다(json 형식). 안으로 the background

Javascript 코드:

$(function(){
var my_data=new Array();
var my_data1=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果调用php成功
}
alert(back);
}
});
});
로그인 후 복사

PHP 코드:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=array();
$backValue[0]=$_POST['trans_data'];
$backValue[1]=$_POST['trans_data1'];
echo json_encode($backValue);
로그인 후 복사

4. 1차원 배열과 2차원 배열을 프론트엔드, 리턴 백그라운드의 2차원 배열(json 형식)

Javascript 코드:

$(function(){
var my_data=new Array();
var my_data1=new Array();
var my_data2=new Array();
my_data[0]=0;
my_data[1]=1;
my_data[2]=2;
my_data1[0]=10;
my_data1[1]=11;
my_data1[2]=12;
my_data2[0]=my_data;
my_data2[1]=my_data1;
$.ajax({
url: "ajax_php.php",
type: "POST",
data:{trans_data:my_data,trans_data1:my_data1,trans_data2:my_data2},
dataType: "json",
error: function(){
alert('Error loading XML document');
},
success: function(data){//如果调用php成功
}
alert(back);
}
});
});
로그인 후 복사

PHP 코드:

header('Content-Type:text/html; charset=gb2312');//使用gb2312编码,使中文不会变成乱码
$backValue=array();
$backValue=$_POST['trans_data2'];
$backValue[2]=$_POST['trans_data'];
$backValue[3]=$_POST['trans_data1'];
echo json_encode($backValue);
로그인 후 복사

위 내용은 제가 작성한 내용입니다. 앞으로 모든 사람에게 도움이 될 것입니다.

관련 기사:

Ajax 도메인 간 요청을 피하기 위해 Nginx 역방향 프록시를 사용하는 방법


AJAX 도메인 간 요청 문제의 Nginx 구현에 대한 심층 분석


$. Ajax() 메소드 매개변수(그림 및 텍스트 튜토리얼)


위 내용은 Ajax 종합 애플리케이션 종합 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿