根据基于其他输入值计算的输入值计算总计

时间:2011-07-25 16:48:28

标签: javascript asp.net

我正在建立一个时间跟踪系统。用户将在一周内输入工作小时数。我们每两周支付一次(2周)。输入每日小时后,onChange将触发一个javascript函数,该函数计算每周总计并将其输出到只读输入文本框(txtWeek1Total和txtWeek2Total)。那部分有效。

下一步是根据txtWeek1Total和txtWeek2Total的输入值自动计算支付期总计(第1周+第2周)。目前,我在这些文本框上使用onChange但它不会触发。仅当我手动将值输入到每周总文本框中时才会触发它。即使这些值在用户每天输入时自动更新。

HTML:

<input type="text" id="week1SundayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1MondayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1TuesdayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1WednesdayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1ThursdayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1FridayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1SaturdayTotal" onChange="calculateWeeklyHours('week1');" /><br />
<input type="text" id="week1WeekTotal" onChange="calculateTotal();" /><br /><br />

<input type="text" id="week2SundayTotal" onChange="calculateWeeklyHours('week2');" /><br />
<input type="text" id="week2MondayTotal" onChange="calculateWeeklyHours('week2');" /><br />
<input type="text" id="week2TuesdayTotal" onChange="calculateWeeklyHours('week2');" /><br />
<input type="text" id="week2WednesdayTotal" onChange="calculateWeeklyHours('week2');"  /><br />
<input type="text" id="week2ThursdayTotal" onChange="calculateWeeklyHours('week2');"  /><br />
<input type="text" id="week2FridayTotal" onChange="calculateWeeklyHours('week2');"  /><br />
<input type="text" id="week2SaturdayTotal" onChange="calculateWeeklyHours('week2');"  /><br />
<input type="text" id="week2WeekTotal" onChange="calculateWeeklyHours('week2');"  /><br />

<input type="text" id="Total" />

的javascript:

function calculateWeeklyHours(week) {
var sunday = document.getElementById(week + 'SundayTotal').value;
var monday = document.getElementById(week + 'MondayTotal').value;
var tuesday = document.getElementById(week + 'TuesdayTotal').value;
var wednesday = document.getElementById(week + 'WednesdayTotal').value;
var thursday = document.getElementById(week + 'ThursdayTotal').value;
var friday = document.getElementById(week + 'FridayTotal').value;
var saturday = document.getElementById(week + 'SaturdayTotal').value;

var weekTotal = document.getElementById(week + 'WeekTotal');
weekTotal.value = Number(sunday) + Number(monday) + Number(tuesday) + Number(wednesday) + Number(thursday) + Number(friday) + Number(saturday);
}

function calculateTotal() {
    var week1 = document.getElementById('w1WeekTotal').value;
    var week2 = document.getElementById('w2WeekTotal').value;

    var total = document.getElementById('Total');
    total.value = Number(week1) + Number(week2);
}

2 个答案:

答案 0 :(得分:2)

使用onkeyup事件而不是onchange事件 - 检查一下(http://jsfiddle.net/JrDd3/2/)

答案 1 :(得分:0)

只需在calculateWeeklyHours函数的末尾调用calculateTotal函数

示例:http://jsfiddle.net/JrDd3/

相关问题