Question

难以措辞的问题对不起家伙！

看看这个小提琴，看看我想要实现的目标，http://jsfiddle.net/SzQwh/ 但基本上当用户检查复选框时，他需要将它们等于45，然后其他复选框将被禁用。

我遇到的问题是，如果您选中一个30个信用卡复选框和一个15个信用卡复选框，然后选择15个信用复选框，则其余复选框仍然保持禁用状态。

如果你玩弄小提琴，所有其他实例都能很好地运作。

很抱歉，如果这是非常明显的，但我无法理解出错的地方

var points = 30;
var maxPoints = 45; 
var sum = 0;

    $(':checkbox').click(function() {
        sum = 0;
        $(':checkbox:checked').each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });
        $('#total_credits').html(sum);  

        if (sum >= maxPoints) {
            $(':checkbox').not(':checked').attr('disabled', true);
        } else if (sum >= points) {
            $('.group2 :checkbox').not(':checked').attr('disabled', true);
        } else {
            $(':checkbox:disabled').attr('disabled', false);
        }        
    });

Answer 1

Update Fiddle 改变这一部分。即。从表达式中删除=。

else if (sum > points)

Answer 2

http://jsfiddle.net/SzQwh/5/

jQuery(document).ready(function($) {

    var points = 30;
    var maxPoints = 45; 
    var sum = 0;

    $(':checkbox').click(function() {
        sum = 0;
        $(':checkbox:checked').each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });
        $('#total_credits').html(sum);  


        if (sum >= points) {
            $('.group2 :checkbox').not(':checked').attr('disabled', true);
            if (sum >= maxPoints) {
                $(':checkbox').not(':checked').attr('disabled', true);

            }  
        else
         {
            $('.group1 :checkbox').attr('disabled', false);
        }        
        } else
         {
            $(':checkbox').attr('disabled', false);
        }

    });
});

Answer 3

我修改了逻辑，如下所示：

if (sum >= maxPoints) {
        $(':checkbox').not(':checked').attr('disabled', true);
    } else if (sum == points) {
        $('.group2 :checkbox').not(':checked').attr('disabled', true);
        $('.group1 :checkbox').not(':checked').attr('disabled', false);
    } else {
        $(':checkbox:disabled').attr('disabled', false);
    }

这是一个有效的demo

Answer 4

$(':checkbox').click(function() {
        sum = 0;
        $(':checkbox:checked').each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });
        $('#total_credits').html(sum);  


        if (sum >= maxPoints) {
            $(':checkbox').not(':checked').prop('disabled', true);
        } else if (sum >= points) {
            $('.group2 :checkbox').not(':checked').prop('disabled',    
                                                          true)
            sum <= points
              &&  $('.group1 :checkbox').not(':checked').prop('disabled',    
                                                               false)
        } else {
            $(':checkbox:disabled').prop('disabled', false);
        }

设置选中/停用状态复选框应使用prop()代替attr()

Answer 5

最佳实施（仅2行逻辑）：http://jsfiddle.net/SzQwh/11/

此外，如果jQuery版本＆gt; = 1.6！

，你应该使用prop而不是attr

$(':checkbox').not(':checked').prop('disabled', sum >= maxPoints);
$('.group2 :checkbox').not(':checked').prop('disabled', sum >= points);

完整代码：

jQuery(document).ready(function($) {
    var points = 30;
    var maxPoints = 45; 
    var sum = 0;

    $(':checkbox').click(function() {
        sum = 0;
        $(':checkbox:checked').each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });
        $('#total_credits').html(sum);
        $(':checkbox').not(':checked').prop('disabled', sum >= maxPoints);
        $('.group2 :checkbox').not(':checked').prop('disabled', sum >= points);  
    });
});

jQuery if else语句没有重置原始复选框状态

5 个答案: