javascript添加两个文本框值并显示在第三个

Question

How do I in javascript/asp add two textbox values and display in third? My code is below

 function fill() {
        var txt8 = document.getElementById("TextBox8").value;
        var txt9 = document.getElementById("TextBox9").value;
        document.getElementById("TextBox10").value = txt8 + txt9;


    }

I have onchange="fill" for both TextBox8 and TextBox9

Answer 1

你必须调用函数， onchange="fill()"注意()

Answer 2

why don't you use jQUery? Here is a sample:

function fill(){
var total=Number($('#TextBox9').val()) + Number($('#TextBox9').val());
$('#TextBox10').val(total);
}

Answer 3

    function Sum() {
        var text1 = document.getElementById('<%= TextBox1.ClientID %>');
        var text2 = document.getElementById('<%= TextBox2.ClientID %>');
        if (text1.value.length == 0 || text2.value.length == 0) {
            text1.value = 0;
            text2.value = 0;
        }

        var x = parseFloat(text1.value);
        var y = parseFloat(text2.value);          

        document.getElementById('<%= TextBox3.ClientID %>').value = x + y;
    }




<table>
    <tr>
        <td style="width: 100px">
            TextBox1</td>
        <td>
            <asp:TextBox ID="TextBox1" runat="server" onkeyup="Sum()"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            TextBox2</td>
        <td>
            <asp:TextBox ID="TextBox2" runat="server" onkeyup="Sum()"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            TextBox3</td>
        <td>
            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            <asp:Button ID="Button1" runat="server" Text="Show" Width="80px" OnClientClick="Sum()" />
        </td>
    </tr>
</table>

Answer 4

You need to convert string to integer. value always return string. jsfiddle

 <input onchange="fill()"  id=TextBox8 />
<input  onchange="fill()"  id=TextBox9 />
<input  id=TextBox10 /> 
<script>

    function fill() {
        var txt8 = document.getElementById("TextBox8").value-0;
        var txt9 = document.getElementById("TextBox9").value-0;
        document.getElementById("TextBox10").value = txt8 + txt9;


    }
</script>

​

Answer 5

Do you have a set of parentheses following the function call? In javascript if you don't follow a function call with parentheses it assumes you are referencing a variable. Also in the future if you are struggling to debug javascript code you should open up your browsers javascript console to see what is going on and what errors (if any) are thrown.

<input type="text" id="TextBox8" onchange="fill()" />

<input type="text" id="TextBox9" onchange="fill()" />