Question

我有一个复选框列表。点击每个复选框后，我将值添加到隐藏变量。但问题是，如果我想在取消选中复选框时从列表中删除该值。如何完成这件作品

这是隐藏的表单变量

<input name="IDList[]" type="hidden" id="IDList" value="" />

和jquery

$(".myCheckboxClass").change(function() {
    var output = 0;
    $(".myCheckboxClass").change(function() {
        if ($(this).is(":checked")) {
            output += ", " + $(this).val();
        } else {
            output = $.grep(output, function(value) {
                return value != $(this).val();
            });
        }
        $("#IDList").val(output);
    });
});

Answer 1

这样的事情:(演示）http://jsfiddle.net/wesbos/5N2kb/1/

我们使用名为vals的对象来存储信息。在我们选中/取消选中时添加和删除。

var vals = {};

$('input[type=checkbox]').click(function() {
    var that = $(this);
    if (that.is(':checked')) {
        console.log(this.name);
       vals[this.name] = "In your Object";
    }
    else {
        delete vals[this.name]; 
    }
    console.log(vals);

});

Answer 2

按照你的逻辑，你可以这样做：

$('#IDList').data('value', []);

$(".myCheckboxClass").change(function() {
    var list = $('#IDList').data('value');

    if ($(this).is(":checked")) {
        list.push($(this).val());
    } else {
        var indexToRemove = list.indexOf($(this).val());
        list.splice(indexToRemove, 1);
    }
    $('#IDList').val(list);
});

但是，如果您只关心数据提交或其他操作时#IDList的值，您可能需要考虑另一种方法：在需要时整理选中的值。

$('#form').submit(function() {
    var list = $('input.myCheckboxClass:checked', this).map(function() {
        return $(this).val();
    }).get();

    $('#IDList').val(list);
});

请参阅以上两项操作：http://jsfiddle.net/william/F6gVg/1/。

从列表中删除值

2 个答案: