通过ajax发送同名多个复选框值答案

【问题标题】：Send same name multiple checkbox values via ajax通过ajax发送同名多个复选框值
【发布时间】：2022-04-15 13:07:03
【问题描述】：

我有多个复选框输入元素。

<input type="checkbox" name="userpages[]" id="1" value="1"/>
<input type="checkbox" name="userpages[]" id="2" value="2"/>
<input type="checkbox" name="userpages[]" id="3" value="3"/>
<input type="checkbox" name="userpages[]" id="4" value="4"/>

我想将选中元素的值传递给 php 脚本通过 Ajax。我试过这样做 -

var pages = $('input[name="userpages[]"]:checked');
    $.ajax({
    type: 'POST',
    url: 'post.php',
    data: {pages: pages},
    dataType: 'json',
    success: function(data) {
        if(data.status == 1) {
            alert('Successfully posted on your Facebook pages !');
        } else if(data.status == 0) {
            alert('Error !! Please try again.');
        } else {
            alert('Unknown Error. Reloading this page now...');
            location.reload();
         }
            }
    });

并在 php 脚本中检索值 -

  foreach($_POST['pages'] as $page_id) {
    echo $page_id;
  }

但这对我不起作用。我还尝试获取变量pages 的值，当它弹出“对象对象”时发出警报。任何帮助都是不言而喻的。 :)

【问题讨论】：

使用控制台调试：console.log(/* variable */)。使用 F12 在 Chrome 中打开控制台。获取更多关于JS数据的信息，还可以执行JS代码行。

标签： javascript php jquery ajax

【解决方案1】：

var checked = [];
$("input[name='userpages[]']:checked").each(function ()
{
    checked.push(parseInt($(this).val()));
});

【讨论】：

【解决方案2】：

数组是正确的。但是，它是一个由 jQuery DOM 元素组成的数组，而不是输入的值。

要在数组中以index => value 对的形式获取数据，并通过 AJAX 发送，请使用以下内容：

var data = []

$('input[name="userpages[]"').each (function (index, element) {
    data[$(element).attr('id')] = $(element).val();
});
console.log(data);

使用 jQUery AJAX 函数发送收集到的数据。

一个 JSFiddle：http://jsfiddle.net/LMbxC/1/

【讨论】：