通过 AJAX 提交表单并增加复选框 id答案

【问题标题】：Submit form via AJAX with incrementing checkbox id's通过 AJAX 提交表单并增加复选框 id
【发布时间】：2011-03-08 22:34:43
【问题描述】：

我有一个正常工作的 AJAX 表单提交，但是我有递增的 id 到我需要根据选中的复选框提交的复选框，然后当用户提交选中的选择时，数据传递到我的 PHP 脚本。

如何通过 AJAX 将所有选中的复选框传递给我的 PHP 脚本？

$(function () {
    $(".submit").click(function () {
        var pageReturn = $("#pageReturn").val();
        var sendCheck = $("#sendCheck").val();
        var dataString = 'pageReturn=' + pageReturn + '&sendCheck=' + sendCheck;

        if (emailLink == '' || pageReturn == '' || sendCheck == '') {
            $('.success').fadeOut(200).hide();
            $('.error').fadeOut(200).show();
        } else {
            $.ajax({
                type: "POST",
                url: "phpscripts/compose.php?artid=<?php echo $artid; ?>&userart=<?php echo $_GET['userart'];?>",
                data: dataString,
                cache: false,
                success: function () {
                    $('.success').fadeIn(200).show();
                    $('.error').fadeOut(200).hide();
                }
            });
        }
        return false;
    });
});

要通过所有复选框，我会在通过复选框的位置添加 +1，例如：

var sendCheck = $("#sendCheck").val()+1;

我的复选框的 HTML 代码如下所示

<input name="sendCheck" id="sendCheck<?php echo $i++; ?>" class="reccomendCheck" type="checkbox" value="<?php echo $row_ArtContact['contact_id'];?>" />

带有需要传递给我的 PHP 脚本的递增值的复选框。

理论上可能存在无限数量的复选框，用户可以随机选中这些复选框并需要被选中。

【问题讨论】：

好的，所以它不起作用？有什么问题？
如何通过 ajax 将所有选中的复选框传递给 php 脚本？我要在某处添加 +1 吗？

标签： javascript jquery ajax forms form-submit

【解决方案1】：

使用serialize 函数生成数据。

看看这个例子：点击几个复选框，看看会发生什么！

http://jsfiddle.net/VeBDk/

例子：

HTML：

<form>
    Check 1<input type="checkbox" name="check1" id="check1" value="1"/>
    Check 2<input type="checkbox" name="check2" id="check2" value="2"/>
    Check 3<input type="checkbox" name="check3" id="check3" value="3"/>
    Check 4<input type="checkbox" name="check4" id="check4" value="4"/>
    Check 5<input type="checkbox" name="check5" id="check5" value="5"/>
    <button>Submit</button>
</form>

jQuery:

$(document).ready(function(){
   var data = $('form').serialize();
   $.post('script.php', data, function(){
     //success!
   });
});

【讨论】：