Javascript 如何使用jQuery ajax post传递多个复选框

如何使用jQuery ajax post传递多个复选框

这是ajax函数

 function submit_form(){
 $.post("ajax.php", {
 selectedcheckboxes:user_ids,
 confirm:"true"
 },
 function(data){
  $("#lightbox").html(data);
  });
 }

这是我的表格

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>

---

来自jquery文档for POST（）：

所以我只需遍历复选框并构建数组。差不多

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

---

如果您不打算推出自己的解决方案，请查看以下jQuery插件：

malsup.com/jquery/form/

---

它会为你做到这一点，甚至更多。强烈推荐。

可以使用以下命令，然后分解post结果

分解（“，”，$\u post['data']）

以提供一个结果数组

var data = new Array();
$("input[name='checkBoxesName']:checked").each(function(i) {
    data.push($(this).val());
});

---

我只是想找到解决同样问题的方法。为了实现Paul的解决方案，我做了一些调整来正确地实现这个函数

var data = { 'venue[]' : []};

$("input:checked").each(function() {
   data['venue[]'].push($(this).val());
});

---

简而言之，添加input:checked而不是：checked将数组中输入的字段限制为仅限于表单上的复选框。Paul确实正确地指出，这个需要作为$（this）

附上，这里有一个更灵活的方法

假设这是你的表格

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>

在您的ajax.php中，您可以尝试回显或打印您的帖子，以查看其中发生了什么。这应该是这样的。只返回您选中的复选框。如果您没有选中任何，它将返回一个错误

<?php 
    print_r($_POST); // this will be echoed back to you upon success.
    echo "This one too, will be echoed back to you";

---

这会更好更简单

var arr = $('input[name="user_ids[]"]').map(function(){
  return $(this).val();
}).get();

console.log(arr);

以下是Paul Tarjan为我工作的内容

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

但是我的页面上有多个表单，它从所有表单中提取复选框，所以我做了以下修改，只从一个表单中提取

var data = { 'user_ids[]' : []};
$('#name_of_your_form input[name="user_ids[]"]:checked').each(function() {
  data['user_ids[]'].push($(this).val());
});
$.post("ajax.php", data);

只需将表单的名称更改为表单的名称即可

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>

我还要提到，如果用户没有选中任何复选框，那么PHP中就不会设置任何数组。我需要知道用户是否选中了所有框，因此我在表单中添加了以下内容：

<input style="display:none;" type="checkbox" name="user_ids[]" value="none" checked="checked"></input>



这样，如果未选中任何框，它仍会将数组的值设置为“无”。
我仍然无法发布它。。如果我对数据执行window.alert，它将为object对象。。。问题出在哪里？应该不是data.user_id.push（$（this.val（））？嗯，您希望数据是一个具有键“user_ids[]”和字符串数组值的对象。（就像我文章的第一部分）。由于val在公共节点上未定义，我将用$来包装它。在“input[name='checkBoxesName']：checked”中，不要忘记在checkBoxesName的名称中添加“[]”，方法是：“input[name='checkBoxesName[]”：checked”干净简单。非常感谢。此选项的主要优点是允许您将其作为特定的数据元素而不是整个数据值传递。例如，数据：{value1:$（“#value1”）.val（），value2:arr}
<input style="display:none;" type="checkbox" name="user_ids[]" value="none" checked="checked"></input>