如何根据用户输入的数量使用操作?

时间:2015-03-10 03:55:23

标签: javascript jquery html-table

我正在尝试制作一个简单的计算器,根据成绩告诉学生他们的平均大学分数。

JSFiddle

我试图让公式做到这一点:
第1步:(标记*信用点)
第2步:将这些总数添加到一起 第3步:获取此总数并将其除以用户输入的数量。

第2步和第3步遇到问题。 现在,当点击计算时,它只是一个接一个地追加每一行的单个答案。我想添加这些值,然后除以输入数量。(因为用户数量因用户而异)

非常感谢任何帮助。

HTML:

<div>
   <table class='table'>
      <tr>
         <th> Unit Code </th>
         <th> Mark </th>
         <th> Credit Point </th>
      </tr>
      <tr>
          <td> <input type="text"></td>
          <td> <input type="text" class='mark'> </td>
          <td> <input type="text" class='creditPoint'>  </td>
      </tr>
       <tr>
          <td> <input type="text"></td>
          <td> <input type="text" class='mark'> </td>
          <td> <input type="text" class='creditPoint'> </td>
       </tr>
        <tr>
          <td> <input type="text"></td>
          <td> <input type="text" class='mark'></td>
          <td> <input type="text" class='creditPoint'> </td>
        </tr>
   </table>
</div>

使用Javascript:

$('#wam').click(function() {
    $('.table tr').each(function() {
        var mark = $(this).find('input.mark').val();
        var cp = $(this).find('input.creditPoint').val();
        var total = ((mark * cp));
        // Find the total then divide by the number of entries

    $('body').append(total);


    });

});

1 个答案:

答案 0 :(得分:2)

您需要在循环中使用共享变量

$('#wam').click(function () {
    var total = 0,
        count = 0;
    $('input.mark').each(function () {
        var mark = this.value;
        var cp = $(this).parent().next().find('input.creditPoint').val();
        var t = mark * cp || 0;//if both the fields are not entered don't add them
        if (t) {
            //if the product is 0 then don't count the value
            count++;
        }
        total += t;
    });
    $('#total').text(total);
    $('#total2').text(count ? total / count : 0);//the ternary condition to prevent division by 0

});

演示:Fiddle