Question

我有一个评级表单，可以让个人得分，然后进入评分组，但我很难弄清楚如何使用jQuery或JavaScript。

例如，我的表单的第一部分具有这种结构，其中每个组的总数应写入CombinedScore字段。

<input id="Food1" name="Food" type="radio" value="5" />
<input id="Food2" name="Food" type="radio" value="10" />
<input id="Food3" name="Food" type="radio" value="15" />

<input id="Drink1" name="Drink" type="radio" value="5" />
<input id="Drink2" name="Drink" type="radio" value="10" />
<input id="Drink3" name="Drink" type="radio" value="15" />

<input name="CombinedScore" type="text" />

第二部分应检查综合得分的值并将其放在适当的组中。例如

<input id="FoodDrinkGroup1" name="FoodDrinkGroup" type="radio" value="1-10" />
<input id="FoodDrinkGroup2" name="FoodDrinkGroup" type="radio" value="11-20" />
<input id="FoodDrinkGroup3" name="FoodDrinkGroup" type="radio" value="21-30" />

因此，如果某人在食物上获得10分，在饮酒上获得15分，则应将其添加到21-30 FoodDrinkGroup。

总而言之，我有三个这样的团体，但我希望如果我可以让它为一个工作，我应该能够将相同的代码应用到其余部分。

Answer 1

对不同的项目组使用类会使选择器更简洁，但即使使用此标记，您也可以这样做

$(function() {
    // Part 1
    var sum = parseInt($('input[name="Food"]:checked').attr('value'));
    sum += parseInt($('input[name="Drink"]:checked').attr('value'));
    $('input[name="CombinedScore"]').val(sum);

    //Part 2
    $('input[name="FoodDrinkGroup"]').each(function(i, elem) {
        var range = $(elem).attr('value').split('-');
        if (sum >= range[0] && sum <= range[1]) {
            $(elem).attr('checked', true);
        }
    });
});

JSFiddle

Answer 2

请参阅以下功能，似乎正常工作。请参阅此处的实时工作示例 - http://jsfiddle.net/YUwUG/

function proc() {

    food = $('input[name=Food]:checked').val();
    drink = $('input[name=Drink]:checked').val();

    combined = parseInt(food) + parseInt(drink);

    $("#combined").val(combined);

    if (combined < 11) {
        $('#FoodDrinkGroup1').attr('checked', 'checked');
    } else if (combined < 21) {
        $('#FoodDrinkGroup2').attr('checked', 'checked');
    } else if (combined < 31) {
        $('#FoodDrinkGroup3').attr('checked', 'checked');
    }

}

Answer 3

迟到但我想我会展示我制作的代码。这只是使用一些数学来确定哪个组，因此它应该选择哪个元素索引。

var total = 0;

$('input[name=Food]:checked, input[name=Drink]:checked')
 .each(function() {
    total += parseInt(this.value);
});

var index = parseInt(total / 11);

$('[name=CombinedScore]').val(total);

$('input[name=FoodDrinkGroup]').eq(index).prop('checked', true);

工作小提琴： http://jsfiddle.net/garreh/5j7Jd/

总分和添加到分级结果

3 个答案: