jquery ajax 向后台传递数组参数示例

下面是详细的“jQuery AJAX向后台传递数组参数”的攻略：

1. jQuery AJAX向后台传递数组参数

在开发中，常常需要通过 AJAX 将一组数据传递给后台进行处理，这时我们可以使用 jQuery 中的 $.ajax() 或 $.post() 方法来处理这个请求。稍微有一点经验的开发者都知道直接传递参数是非常容易的，但如果传递数组类型的参数，就需要稍微注意一下。下面我们来演示具体的方法。

2. jQuery AJAX使用方式

（1）$.ajax()与$.post()方法

使用 $.ajax() 或 $.post() 方法都可以发送 AJAX 请求。这两个方法的基本使用方式差不多，但是 $.ajax() 更为强大，可以针对各种情况进行处理。下面我们来介绍一下这两个方法的使用方式。

$.ajax({
    type: 'POST',
    url: 'url地址',
    data: { 'param1': 'value1', 'param2': 'value2' },
    success: function (msg) { 
        //请求成功时处理逻辑
    },
    error: function (xhr, textStatus, errorThrown) { 
        //请求失败时处理逻辑
    }
});

$.post('url地址', { 'param1': 'value1', 'param2': 'value2' }, function(msg) {
    //请求成功时处理逻辑
});

（2）数据传递方式

在上面的示例中，我们传递了一个 JSON 格式的对象作为第三个参数 data，并且使用了 POST 方式发送请求。使用 POST 方式发送数据时，数据是通过 HTTP 请求体（request body）发送的。

而如果使用 GET 方式发送数据，数据是通过 HTTP 请求参数（query string）发送的。如下所示：

$.get('url地址', { 'param1': 'value1', 'param2': 'value2' }, function(msg) {
    //请求成功时处理逻辑
});

（3）数组参数传递

如果要传递数组类型的参数，我们需要将这个数组转换成一个字符串，然后将这个字符串作为参数传递过去。下面是具体的代码示例：

var arr = [1, 2, 3];
$.ajax({
    type: 'POST',
    url: 'url地址',
    data: { 'array': arr.join(',') },
    success: function (msg) {
       //请求成功时处理逻辑
    },
    error: function (xhr, textStatus, errorThrown) {
       //请求失败时处理逻辑
    }
});

我们将数组 arr 首先转换为一个字符串，使用 join() 方法将数组元素用逗号拼接起来，然后作为参数传递给了后台。

3. 示例说明

示例一：

传递一个字符串数组作为参数，然后在后台将这个数组逆序处理。

JS 代码：

var arr = ['123', '456', '789'];
$.ajax({
    type: 'POST',
    url: 'url地址',
    data: { 'array': arr.join(',') },
    success: function (msg) {
        //请求成功时处理逻辑
    },
    error: function (xhr, textStatus, errorThrown) {
        //请求失败时处理逻辑
    }
});

PHP 代码：

$array = $_POST['array'];
$arr = explode(',', $array);
//array_reverse() 方法是将数组逆序
$result = array_reverse($arr);
echo json_encode($result);

示例二：

传递一个整型数组作为参数，然后在后台将这个数组元素逐个相加并返回结果。