如何將一個值從跨度移動到輸入中？

Question

我從http://jsfiddle.net/nobuts/89NtM/了一個腳本，並想知道如果我可以做的所有投入總數爲的<input>代替<span>

我試過<input type="text" id="sum" />但它不工作的一些原因。順便說一句，我不是一個jquery的傢伙。所以你們可以給我一個解決方案。

這裏是一個腳本：

$(document).ready(function(){ 
    //iterate through each textboxes and add keyup 
    //handler to trigger sum event 
    $(".txt").each(function() { 

     $(this).keyup(function(){ 
      calculateSum(); 
     }); 
    }); 

}); 

function calculateSum() { 

    var sum = 0; 
    //iterate through each textboxes and add the values 
    $(".txt").each(function() { 
     //add only if the value is number 
     if(!isNaN(this.value) && this.value.length!=0) { 
      sum += parseFloat(this.value); 
     } 
    }); 
    //.toFixed() method will roundoff the final sum to 2 decimal places 
    $("#sum").html(sum.toFixed(2)); 
} 

HTML

<table width="300px" border="1" style="border-collapse:collapse;background-color:#E8DCFF"> 
     <tr> 
      <td width="40px">1</td> 
      <td>Butter</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr> 
      <td>2</td> 
      <td>Cheese</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr> 
      <td>3</td> 
      <td>Eggs</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr> 
      <td>4</td> 
      <td>Milk</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr> 
      <td>5</td> 
      <td>Bread</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr> 
      <td>6</td> 
      <td>Soap</td> 
      <td><input class="txt" type="text" name="cost"/></td> 
     </tr> 
     <tr id="summation"> 
      <td>&nbsp;</td> 
      <td align="right">Sum :</td> 
      <td align="center"><span id="sum">0</span></td> 
     </tr> 
    </table> 

問候，

Answer 1

變化

<span id="sum">0</span> 

到

<input id="sum" value="0" /> 

，改變

$("#sum").html(sum.toFixed(2)); 

到

$("#sum").val(sum.toFixed(2));