0

我想计算用户在文本输入中为问题中的每个答案输入的数字与问题的总分之间的差异。

我有一个当前执行此操作的jsfiddle应用程序。当您在答案的文本输入中更改值时,它将计算输入的数字与属于该问题的总分之间的差值。

我的问题是,目前它只有在我有一个或两个答案时才有效。但是一个问题可以有很多答案,他们可以有 3、4、5 甚至 10 个答案,甚至更多。所以我的问题是,如何更改下面的小提琴,以便它可以为多个文本框执行计算,而不仅仅是 2 个文本框?

http://jsfiddle.net/jTXy5/3/这个 jsfiddle 有一个问题,其中包含 3 个答案。但是没有计算第三个文本输入

以下是应该发生的情况的示例:

 Question No.   Question                 Answer     Marks per Answer    Total Marks
 1              Here are 2 answers       B          (text input) = 2        1
                                         D          (text input) = 1
                                         E          (text input) = 1
 2              Here is a single answer  True       (text input) = 5        0

正如您在上表中看到的,问题 1 中答案的文本输入总共等于 4。所以 5(来自问题 1 的总分)减去 4 = 1(现在总分等于 1)

对于问题 2,问题 2 中答案的文本输入等于 5,因此 5(来自问题 2 的总分)减去 5 = 0(总分现在等于 0)。

下面是执行计算的代码:

$('tr').each(function() {
    var $input = $(this).find('input');
    var $row = $(this);
    var is_multiple = !$input.prop('readonly');
    var rowClass = is_multiple ? 'multiple' : 'single';
    if (is_multiple) {
        var is_first = $row.find('td').length == 5;
        rowClass += is_first ? ' first' : ' second';
    } else {
        /* readonly just needs marks changed once on page load */
        $row.find('.noofmarkstd').text(5 - $input.val());
    }
    $input.addClass(rowClass);
});

$('input.multiple').keyup(function() {
    var $input = $(this);
    var is_first = $input.is('.first');
    var $row = $input.closest('tr');
    var $otherRow = $row[is_first ? 'next' : 'prev']();
    var $marks = is_first ? $row.find('.noofmarkstd') : $otherRow.find('.noofmarkstd');

    var calcs = 5 - ($input.val() || 0) - ( $otherRow.find('input.multiple').val() || 0);
    $marks.text(calcs);    
});

/* if need calcs for multiples generated on pageload trigger a change on the first in set*/
 $('input.first').change();
4

1 回答 1

0
var $inputs = $('input.individualMarks');

$inputs.filter(function() {
    return $(this).prop('readonly') === true;
}).each(function() {
    var $input = $(this);

    var $marks = $input.closest('tr').css('color', 'red').find('td.noofmarkstd');
    $marks.html(5 - ($input.val() || 0) + '<br>(single test)');
});

$inputs.filter('[data-q_group]').keyup(function() {
    var $group = $inputs.filter('[data-q_group="' + $(this).data('q_group') + '"]');
    var $marks = $group.eq(0).closest('tr').find('td.noofmarkstd');
    var markVal = 5;
    $group.each(function() {
        markVal -= ($(this).val() || 0)
    })
    $marks.text(markVal)

})​
于 2012-11-07T23:27:12.947 回答