jquery - 如何将值从跨度移动到输入？

Question

我有一个来自http://jsfiddle.net/nobuts/89NtM/的脚本，想知道我是否可以将所有输入的总数变成 a<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));