0

我一直在尝试根据选中和未选中框的值从隐藏的表单字段中添加和减去并更新屏幕文本。我已经能够成功地添加所有选中的复选框值并使用 .each 更新隐藏的输入字段。但是,我有很多时间从总数中减去值。

我似乎无法避免的问题是减去第一个选中框的值,而不是我实际上取消选中的框。我试图通过 id 引用该框,但这似乎没有帮助。

$(document).on("click", ".activities .checkbox-select", function(event){

    //event.preventDefault();
    $(this).parent().addClass("selected");

    //Checks the checkbox
    $(this).parent().find(":checkbox").prop('checked', true);

    var total = parseFloat($("#basePoints").val());
    $(':checkbox:checked.activity').each(function() {

        var activtyValues = 0;
        activtyValues = parseFloat(this.value);

        total += activtyValues;

        //Update the screen value
        $("#calulatedpoint").text(total);

        //Update the hidden value
        $("#calulatedPointsHidden").val(total);
    });     
});

$(document).on("click", ".activities .checkbox-deselect", function(event){

    //Get the checkbox id
    var id = $(this).attr('id');

    //event.preventDefault();
    $(this).parent().removeClass("selected");

    var total = $("#calulatedPointsHidden").val();
    checkedValue = $("input[@id="+id+"]:checked").val();  //It's finding the first checked checkbox value and subtracting that



    total -= checkedValue;

    //Update the screen value
    $("#calulatedpoint").text(total);

    //Update the hidden value
    $("#calulatedPointsHidden").val(total);

    //Unchecks the checkbox
    $(this).parent().find(":checkbox").removeAttr("checked");
});

任何解决我的减法问题的帮助将不胜感激。改进我的加法部分的提示也会很棒。谢谢。

4

2 回答 2

0

我最终通过模仿我如何添加复选框值来解决我的问题。因为现在功能几乎相同,所以我将努力使用一个功能来处理检查和取消检查。下面是最终从我的运行总数中减去我取消选中的复选框的值。

$(document).on("click", ".activities .checkbox-deselect", function(event){

    //event.preventDefault();
    $(this).parent().removeClass("selected");

    //Unchecks the checkbox
    $(this).parent().find(":checkbox").removeAttr("checked");

    var total = parseFloat($("#basePoints").val());
    $(':checkbox:checked.activity').each(function() {

        var activtyValues = 0;
        activtyValues = parseFloat(this.value);

        total += activtyValues;

    });

    //Update the screen value
    $("#calulatedpoint").text(total);

    //Update the hidden value
    $("#calulatedPointsHidden").val(total);
});
于 2012-06-10T18:07:46.093 回答
0

缺陷就在这里,我相信

checkedValue = $("input[@id="+id+"]:checked").val();

此复选框不再选中,但您在 jquery 选择器中指定选中,似乎它不会返回任何值,因为您还包括 id?

@ 符号也不再用于属性选择,也许您使用的是旧版本的 jquery?

var checkedValue = $("input[id=" + id + "]").val();
console.log(checkedValue);

编辑: 添加可能的替代版本,使用 1 单击事件处理程序

$(document).on("click", ".activities", function(event) {
    // add up all the checked items
    // set/reset the hidden field

    if ($(this).is(":checked")) {
        // update UI for checked item
    } else {
        // update UI for unchecked item
    }
});
于 2012-06-09T05:13:15.257 回答