>  기사  >  웹 프론트엔드  >  jquery의 ajax가 배열을 배경으로 전달하는 방법

jquery의 ajax가 배열을 배경으로 전달하는 방법

WBOY
WBOY원래의
2023-05-18 15:59:371440검색

jQuery는 풍부한 기능과 구성 요소를 제공하는 인기 있는 프런트 엔드 JavaScript 프레임워크이며 그 중 하나가 Ajax입니다. Ajax에서는 단일 값이든 다중 값이든 데이터를 백그라운드로 전달해야 하는 경우가 많습니다. 이 기사에서는 jQuery의 Ajax를 사용하여 배열을 배경으로 전달하는 방법을 소개합니다.

  1. 배열 직렬화

배열을 전달하기 전에 전송 가능한 형식으로 직렬화해야 합니다. jQuery의 $.param() 메서드를 사용하여 배열을 "name=value" 형식의 문자열로 직렬화할 수 있습니다. 예:

var arr = [1, 2, 3];
var param = $.param({ data: arr }); // "data%5B%5D=1&data%5B%5D=2&data%5B%5D=3"

위의 예에서는 먼저 세 개의 값을 포함하는 배열 arr을 정의합니다. 그런 다음 $.param() 메서드를 호출하여 배열을 "data"라는 매개변수가 포함된 문자열로 직렬화합니다. 이 매개변수의 값은 배열의 직렬화된 결과입니다. 마지막으로 우리가 얻은 param 변수에는 직렬화된 문자열이 포함되어 있습니다.

  1. 직렬화된 문자열 전달

이제 배열을 문자열로 직렬화했으므로 Ajax를 사용하여 이 문자열을 백그라운드로 전달할 수 있습니다. jQuery의 $.ajax() 메서드를 사용하여 POST 요청을 보내고 직렬화된 문자열을 요청 매개변수로 사용할 수 있습니다. 예:

var arr = [1, 2, 3];
var param = $.param({ data: arr });
$.ajax({
    url: "example.php",
    type: "POST",
    data: param,
    success: function(result) {
        console.log(result);
    }
});

위의 예에서는 일부 옵션 매개변수를 전달하여 $.ajax() 메서드를 호출했습니다. 그 중 url은 요청된 URL을 나타내고, type은 요청 유형을 POST로 나타내고, data는 요청 매개변수를 나타내며, Success는 요청 성공 후 실행되는 콜백 함수를 나타냅니다. 이 예에서는 직렬화된 문자열을 요청 매개변수로 Ajax에 전달합니다.

  1. 백그라운드에서 반환된 배열을 수신합니다

백그라운드에서는 수신된 요청 매개변수를 구문 분석하고 직렬화된 배열 데이터를 추출해야 합니다. 이 작업은 PHP의 parse_str() 함수를 사용하여 수행할 수 있습니다. 예:

$data = array();
parse_str($_POST['data'], $data);

위의 예에서는 먼저 빈 배열 $data를 정의한 다음 pars_str() 함수를 사용하여 $_POST 배열에서 "data"라는 매개변수를 추출합니다. parse_str() 함수는 이 직렬화된 문자열을 PHP 배열로 구문 분석하고 $data 변수에 저장합니다. 이제 이 배열을 내부적으로 사용하여 다양한 작업을 수행할 수 있습니다.

  1. 전체 예제

이제 jQuery의 Ajax를 사용하여 백엔드에 배열을 전달하고 해당 응답을 받는 방법을 보여주는 전체 예제를 살펴보겠습니다.

var arr = [1, 2, 3];
var param = $.param({ data: arr });
$.ajax({
    url: "example.php",
    type: "POST",
    data: param,
    success: function(result) {
        console.log(result); // ["1", "2", "3"]
    }
});
$data = array();
parse_str($_POST['data'], $data);
$response = json_encode($data['data']);
echo $response;

이 예제에서는 먼저 배열 arr을 정의합니다. 가치. 그런 다음 $.param() 메서드를 사용하여 문자열 매개변수로 직렬화합니다. 다음으로 $.ajax() 메소드를 사용하여 "example.php"에 POST 요청을 보내고 요청 매개변수는 param 문자열입니다.

내부적으로는 parse_str() 함수를 사용하여 요청 매개변수를 구문 분석하고 이를 PHP 배열 $data로 변환했습니다. 그런 다음 json_encode() 함수를 사용하여 이 배열을 JSON 형식 문자열로 변환하고 이를 응답으로 반환합니다.

프런트 엔드에서는 jQuery의 성공 콜백 함수를 사용하여 응답을 받습니다. 이 예에서 응답은 세 개의 문자열을 포함하는 배열입니다. 확인을 위해 콘솔로 출력합니다.

이 전체 예제를 통해 jQuery의 Ajax를 사용하여 배열을 배경으로 전달하고 응답을 받는 방법을 이해해야 합니다. 이 예는 실제 개발에 이러한 기술을 적용하는 데 도움이 될 수 있습니다.

위 내용은 jquery의 ajax가 배열을 배경으로 전달하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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