javascript - 从表格中获取表格中的输入值

Question

当用户将值输入到仅包含数字的文本框中时，我需要执行所有这些功能。当值不是数字时，我还想在目标文本框中显示一条消息，请求他们插入一个有效值。当输入数据正确时，我希望函数对这些值进行计算并将它们显示在目标 td 中。此外，当没有插入任何值时，我希望 td 显示 0€。我试过使用 inner.HTML 方法。

我知道我需要触发函数的事件，但我不确定哪种方法最好。

我也怀疑我是否可以像我那样编写 HTML 标记，在 td 标签中插入一个 input 标签。

鉴于标记是合法的，我需要帮助来编写第一个函数并使其运行。所有其他功能都被注释掉。

这是 Fiddle 的链接:http://jsfiddle.net/MMendes/mqu7A/

   var A = {

       //calculate the total invoiced for the day
       calcTotalDay: function () {
           //get the total invoiced for the day and set the value to 0€
           var dayTotal = document.getElementById("daytotal");
           dayTotal.innerHTML = "0€";
           //get the input values for invoiced and lastInvoiced
           var invoiced = document.getElementById("invoiced").value;
           var lastInvoiced = document.getElementById("lastinvoiced").value;
           //make sure the input values are number types. If not display 
           //message demanding to insert a valid value
           if (typeof invoiced !== Number)
               invoiced.innerHTML = "Insert a valid value!";
           if (typeof lastInvoiced !== Number)
               lastInvoiced.innerHTML = "Insert a valid value";
           //return the sum of the total by adding invoiced 
           //and lastInvoiced and adding the euro sign
           return invoiced + lastInvoiced + " €";
       }

   };

Answer 1

由于您的 fiddle 没有此 calcTotalDay 函数，因此我将做出我认为正确的假设:

var A = {

   //calculate the total invoiced for the day
   calcTotalDay: function () {

       //get the total invoiced for the day and set the value to 0€
       var dayTotal = document.getElementById("daytotal");
       dayTotal.innerHTML = "0€";

       //get the input values for invoiced and lastInvoiced ""parsed as integers""
       var invoiced = parseInt(document.getElementById("invoiced").value, 10);
       var lastInvoiced = parseInt(document.getElementById("lastinvoiced").value, 10);

       //make sure the input values are number types. If not display 
       //message demanding to insert a valid value
       var type1 = typeof invoiced;
       var type2 = typeof lastInvoiced;
       if (type1 !== 'number')
           invoiced.innerHTML = "Insert a valid value!";
       if (type2 !== 'number')
           lastInvoiced.innerHTML = "Insert a valid value";

       //return the sum of the total by adding invoiced  
       //and lastInvoiced and adding the euro sign ""only when both are numbers""
       if(type1 === 'number' && type2 === 'number')
           return invoiced + lastInvoiced + " €";
       else 
           return "invalid";
   }

};