如何使用 jquery ajax 将选中复选框的值发送到另一个页面

Posted 2023-03-05

【中文标题】如何使用 jquery ajax 将选中复选框的值发送到另一个页面

【英文标题】：How can I send value of checked checkboxes to another page with jquery ajax

【发布时间】：2012-05-17 04:16:28

【问题描述】：

我使用$.get(... 语法通过Jquery Ajax 发送我的表单数据。 我想知道如何发送选中复选框的值。 例如，我使用$("#myinput").val() 将输入框值发送到我的 php 页面。

【问题讨论】：

Here 是关于 jQuery 复选框值的大量信息。

【参考方案1】：

您可以在表单中使用serialize() 或serializeArray()。 示例：

var data = $('yourform').serialize();

或

var data = $('yourform').serializeArray();

然后把数据放到ajax中

$.get('link.php',data,function()...);

【参考方案2】：

我不知道你的 html 是什么样子的。这是一个通用的解决方案。您可以根据自己的特定需求进行自定义

假设你有一些这样的 HTML 标记

Item 11<input type="checkbox" id="chk1" value="11" class="chkItem"  /><br/>
Item 12<input type="checkbox" id="chk2" value="12" class="chkItem"  /><br/>
Item 14<input type="checkbox" id="chk4" value="14" class="chkItem"  /><br/>
<input type="submit" value="Save" id="btnSave" />

脚本是

$(function()
   $("#btnSave").click(function(e)
        e.preventDefault();
        var items=$("input[type='checkbox']:checked").map(function () 
            return this.value;
        ).get().join(',');

        $.post("yoururl.php?data="+items,function(response)
         //alert(response);
        );        
   );           
);

上述脚本将获取所有选中的输入元素，并使用逗号分隔的选定项目值构建一个字符串，并将其发送到查询字符串中。您可以在您的 php 文件中读取此内容并用逗号分隔并读取值。