动态汇总文本框值asp.net

时间:2014-01-27 04:27:08

标签: javascript asp.net

在我的应用程序中,我有五个文本框。我想要做的任务是添加(总和)在五个texbox中输入的值并将其显示在第6个文本框中。我尝试了以下代码,但它没有显示添加。你能告诉我这里我做错了吗?

ASPX代码

<asp:TextBox ID="D1" runat="server"  Width="50px" onkeypress="return validate(event)" onkeyup="calc()" ></asp:TextBox>
            <asp:TextBox ID="D2" runat="server" Width="50px" onkeypress="return validate(event)" onkeyup="calc()" ></asp:TextBox>
            <asp:TextBox ID="D3" runat="server" Width="50px" onkeypress="return validate(event)" onkeyup="calc()" ></asp:TextBox>
            <asp:TextBox ID="D4" runat="server" Width="50px" onkeypress="return validate(event)" onkeyup="calc()" ></asp:TextBox>
            <asp:TextBox ID="D5" runat="server" Width="50px" onkeypress="return validate(event)" onkeyup="calc()" ></asp:TextBox>


 Total Hours<asp:TextBox ID="Total" runat="server" Width="50px" ReadOnly="True"></asp:TextBox>

的JavaScript

 <script type="text/javascript">

        //Function to allow only numbers to textbox

        function validate(key) {
            //getting key code of pressed key
            var keycode = (key.which) ? key.which : key.keyCode;
            var phn = document.getElementById('D1');
            var phn1 = document.getElementById('D2');
            var phn2 = document.getElementById('D3');
            var phn3 = document.getElementById('D4');
            var phn4 = document.getElementById('D5');
            //comparing pressed keycodes
            if (!(keycode == 8 || keycode == 46) && (keycode < 48 || keycode > 57)) {
                return false;
            }

        }

        void function calc(dat) {
            var a1, a2, a3, a4, a5, total, pp;

            a1 = document.getElementById("<%=D1.ClientID%>").value;
            a2 = document.getElementById("<%=D2.ClientID%>").value;
            a3 = document.getElementById("<%=D3.ClientID%>").value;
            a4 = document.getElementById("<%=D4.ClientID%>").value;
            a5 = document.getElementById("<%=D5.ClientID%>").value;


            total = parseInt(a1) + parseInt(a2) + parseInt(a3) + parseInt(a4) + parseInt(a5);

            document.getElementById(<%=Total%>).value = total;

        }

</script>

2 个答案:

答案 0 :(得分:1)

Plz检查修改:  

<script type="text/javascript">

    function validate(key) {

        //getting key code of pressed key
        var keycode = (key.which) ? key.which : key.keyCode;
        var phn = document.getElementById('D1');
        var phn1 = document.getElementById('D2');
        var phn2 = document.getElementById('D3');
        var phn3 = document.getElementById('D4');
        var phn4 = document.getElementById('D5');
        //comparing pressed keycodes
        if (!(keycode == 8 || keycode == 46) && (keycode < 48 || keycode > 57)) {
            return false;
        }

    }
    function calc() {
        var a1, a2, a3, a4, a5, total, pp;

        a1 = document.getElementById("<%=D1.ClientID%>").value;
        a2 = document.getElementById("<%=D2.ClientID%>").value;
        a3 = document.getElementById("<%=D3.ClientID%>").value;
        a4 = document.getElementById("<%=D4.ClientID%>").value;
        a5 = document.getElementById("<%=D5.ClientID%>").value;

        total = parseInt(a1) + parseInt(a2) + parseInt(a3) + parseInt(a4) + parseInt(a5);

        if ($.isNumeric(total)) {
            $('#Total').val(total);
        }

    }

</script>

答案 1 :(得分:1)

DEMO FIDDLE

** HTML **

            <asp:TextBox ID="D1" runat="server"  Width="50px" CssClass="sum"></asp:TextBox>
            <asp:TextBox ID="D2" runat="server" Width="50px" CssClass="sum"></asp:TextBox>
            <asp:TextBox ID="D3" runat="server" Width="50px" CssClass="sum"></asp:TextBox>
            <asp:TextBox ID="D4" runat="server" Width="50px" CssClass="sum"></asp:TextBox>
            <asp:TextBox ID="D5" runat="server" Width="50px" CssClass="sum"></asp:TextBox>


 Total Hours<asp:TextBox ID="Total" runat="server" Width="50px" ReadOnly="True" ClientIDMode=static"></asp:TextBox>

** Jquery **

    $('.sum').keydown(function(e) {
        //getting key code of pressed key
        var keycode = (e.which) ? e.which : e.keyCode;
        //comparing pressed keycodes
        if (!(keycode == 8 || keycode == 46) && (keycode < 48 || keycode > 57)) {
            e.preventDefault();
        }
    });

    $('.sum').keyup(function(e) {
        var total=0;
        var current;
        $('.sum').each(function(){
            current=parseInt($(this).val());
        if($.isNumeric(current))
        {
           total+=  current;              
        }
        });
        $("#Total").val(total);

    });