javascript - 在 javascript 中跳过了特定条件

Question

我正在尝试制作一个 javascript 价格计算器，它从不包含文本字段但仅包含单选按钮和复选框的表单中获取值。这是我的 JavaScript:

service = 0;

var setPoint = function (elem) {
    var $e = $(elem);
    var points = $e.attr("data-points");
    switch ($e.attr("name")) {
        case 'group1':
            group1 = parseFloat(points);
        case 'group2':
            group2 = parseFloat(points);
        case 'group4':
            group4 = parseFloat(points);
        case 'group5':
            group5 = parseFloat(points);
        case 'services':
            if ($(elem).attr('checked1') == 'true') {
                $(elem).attr("checked1", "false");
                service = parseFloat(service) - parseFloat(points);
            } else {
                $(elem).attr("checked1", "true");
                service = parseFloat(service) + parseFloat(points);
            }
    }
}

var calculatePoints = function () {    
    var total;    
    var values = [group1, group2, group4, group5, service];

    values.map(function (value) {
        if (value == "" || value == undefined || value == NaN) {
            value = 0;
            return value;
        }
    });

    if (service == 0) {
        window.alert("At least one service needs to be selected!");
        console.log("Service = 0");
    } else if (service <= 20) {
        total = group1 + group2 + group4 + group5 + service;
    } else if (service > 20 && service <= 40) {
        total = group1 + group2 + group4 + group5 + (service * 0.8);
    } else total = group1 + group2 + group4 + group5 + (service * 0.7);

    console.log(total * 1000);

    return false;
}

但不知何故，条件语句 if (service==0) 根本不起作用!

每次单击表单字段时，我都在我的 HTML 中使用 onclick 方法调用 setPoints 函数，并使用 onsubmit 调用 calculatePoints 函数。我已确保使用 onsubmit 时页面不会刷新。

我不知道我的代码有什么问题，也不知道为什么会这样，所以解释和您的解决方案会对我很有帮助。您可以在此处找到包含完整代码的代码笔:http://codepen.io/anshap1719/pen/pNjepV

Answer 1

尝试在 switch case 中以 break 语句结束每个 case。

switch ($e.attr("name")) {
    case 'group1':
        group1 = parseFloat(points);
        break;
    case 'group2':
        group2 = parseFloat(points);
        break;
    case 'group4':
        group4 = parseFloat(points);
        break;
    case 'group5':
        group5 = parseFloat(points);
        break;
    case 'services':
        if ($(elem).attr('checked1') == 'true') {
            $(elem).attr("checked1", "false");
            service = parseFloat(service) - parseFloat(points);
        } else {
            $(elem).attr("checked1", "true");
            service = parseFloat(service) + parseFloat(points);
        }
        break;
}