Javascript 如何在ajax中使用复选框值作为数据参数

我需要在单击提交按钮时重新加载页面。新页面应显示的内容取决于重新加载之前选中的复选框。 我的问题是，当我单击“提交”时，

$（“按钮”）。单击（函数（）…

获取正确的值，但

$（文档）。就绪（函数（）…

始终获取值

true

（默认值）

如何在重新加载之前保存这些值，以便在

$（document）.ready（function（）…

）上使用它们？是否可以将它们作为数据参数发送

$(document).ready(function() {
    var selectedCheckboxes = new Array();

    $.ajax({
        url: 'getNewForm.php?accion=value1',
        data: 'selectedCheckboxes',
        dataType: 'json',
        error: function() {
          alert("ERROR");
        },
        success: function(res) {
          //Do something
        }
      }
    });

  $("button").click(function() {

    var selectedCheckboxes = new Array();
    selectedCheckboxes[0] = document.getElementById("checkbox1").checked;
    selectedCheckboxes[1] = document.getElementById("checkbox1").checked;
  });

});

---

注意：我做了两次

var selectedcheckbox

尝试得到不同的结果，不知道应该在哪里做。

这里有几个问题：

您的代码示例中存在语法错误。请确保您发布到StackOverflow的代码在编译和运行时没有语法错误（假设您没有询问特定代码段生成语法错误的原因：）

AJAX请求的

data

属性被错误地指定为文本字符串

'selectedcheckbox'

，这意味着您的浏览器将发送文本字符串“selectedcheckbox”作为负载到服务器

此外，正如您正确推测的那样，您没有正确处理

selectedcheckbox

的初始化。在JS中使用

var

初始化的变量的作用域是包含函数，这意味着

selectedcheckbox

声明在

click（）中

handler永远不会出现在它之外

另外，您将获得两次“checkbox1”的值；您可能希望获得名为“checkbox2”或类似的值。相关：如果您只是序列化表单中的唯一输入，请使用jquery的

serialize（）

方法，这样代码就更少了

如果确实要重新加载整个页面，请不要使用AJAX请求来完成此操作？如果您不想重新加载整个页面，则通常使用AJAX提交表单（见下文），但对于您声明的用例，它会增加您不需要的复杂性。只需使用一个带有复选框和提交按钮的简单表单，并让浏览器执行其默认操作即可

下面是一个使用AJAX在后台提交表单的示例，无需重新加载整个页面：

给定HTML：

<form id="checkboxForm">
    <input type="checkbox" name="check" value="check1" checked="checked" id="ch1"/>
    <label for="ch1">check1</label>
    <br/>
    <input type="checkbox" name="check" value="check2" checked="checked" id="ch2" />
    <label for="ch2">check2</label>
    <br/>
    <button>Click me</button>
</form>

---

至于加载包含以前选择的新页面，您必须以某种方式维护状态。您的选项包括从服务器传回状态、将选择存储在浏览器的本地存储或cookie中。我建议从服务器传回状态，但您的用例有点不清楚。

没有任何地方可以这样做你真的重新加载了页面，所以我不明白你想做什么。好的，我正在检查它们。1.抱歉，我删除了部分没有导致问题的代码。为了简化这一点，我可能在那里犯了一个错误。2.这是我的疑问之一，数据是如何发送的。我找不到任何关于如何使用

$（文档）的好教程.ready（function（）…

，任何帮助，以便我可以在再次发布之前阅读。3.好的，我将检查一下。4.这是一个打字错误。5.我将看到。我仍然不知道为什么要重新加载页面，可能是因为我使用了提交按钮吗？

$(document).ready(function() {
  $("button").click(function() {
    $.ajax({
      url: 'getNewForm.php?accion=value1',
      data: $('#checkboxForm').serialize(),
      dataType: 'json',
      error: function() {
        alert("ERROR");
      },
      success: function(res) {
        alert("SUCCESS");
      }
    });
  });
});