jquery之checkbox全选反选提交参数

以下是一个使用jQuery实现checkbox全选、反选并且在提交时附加额外参数的示例代码：

HTML部分：

<form id="myForm">
    <input type="checkbox" class="selectAll"> 全选<br>
    <input type="checkbox" name="items" value="1"> Item 1<br>
    <input type="checkbox" name="items" value="2"> Item 2<br>
    <input type="checkbox" name="items" value="3"> Item 3<br>
    <input type="submit" value="提交">
</form>

jQuery部分：

$(document).ready(function() {
    // 全选反选功能
    $('.selectAll').click(function() {
        $('input[name="items"]').prop('checked', this.checked);
    });
 
    // 提交表单时附加参数
    $('#myForm').submit(function(e) {
        e.preventDefault(); // 阻止表单默认提交
 
        var formData = $(this).serialize(); // 序列化表单数据
        formData += '&additionalParam=value'; // 附加额外参数
 
        // 使用AJAX提交表单
        $.ajax({
            type: 'POST',
            url: $(this).attr('action'),
            data: formData,
            success: function(response) {
                // 处理响应
                console.log(response);
            },
            error: function() {
                // 处理错误
                console.log('Error submitting the form');
            }
        });
    });
});

在这个示例中，当用户点击“全选”复选框时，所有的商品选择框会相应地被全选或全不选。在表单提交时，我们通过serialize方法获取表单数据并附加额外的参数，然后通过AJAX方法异步提交数据到服务器。这样可以避免页面刷新，并允许你在提交时添加额外的参数。