文章/答案/技术大牛

发布

社区首页 >问答首页 >javascript calculation asp.net文本框

问javascript calculation asp.net文本框
EN

Stack Overflow用户

提问于 2017-10-05 21:39:18

回答 3查看 328关注 0票数 0

我在一个多视图控件中有几个视图中的一系列文本框，用户可以在其中输入数字。当用户在textbox A3和A4中输入数字时，总和将显示在textbox A5中，该功能被禁用，因此用户无法使用javascript在其中键入。在整个视图中，对于不同的文本框对，此函数将发生8次。有没有一种方法可以重用一个函数，而不是复制8次javascript函数，唯一的区别是textbox的ID。到目前为止，在大学学习javascript只有一些基础知识。

JavaScript

    function A5Formula() {
        var num1 = document.getElementById("<%=A3.ClientID %>");
        var num2 = document.getElementById("<%=A4.ClientID %>");

        var t1 = 0, t2 = 0; t3 = 0

        if (num1.value != "") t1 = num1.value;
        if (num2.value != "") t2 = num2.value;
        t3 = parseInt(t1) + parseInt(t2);

        document.getElementById("<%=A5.ClientID %>").value = t3;
        document.getElementById("<%=A5hidden.ClientID %>").value = t3;
    }

ASP.NET

    <asp:TextBox ID="A3" runat="server" CssClass="inputcss" onblur="A5Formula()" CausesValidation="True" AutoCompleteType="Disabled"></asp:TextBox>

    <asp:TextBox ID="A4" runat="server" CssClass="inputcss" onblur="A5Formula()" CausesValidation="True" AutoCompleteType="Disabled"></asp:TextBox>

    <asp:TextBox ID="A5" runat="server" CssClass="inputcss" Enabled="False" AutoCompleteType="Disabled" ></asp:TextBox>

谢谢

简化的网页

        <%@ Page Language="VB" AutoEventWireup="false" 
        CodeFile="Default.aspx.vb" Inherits="_Default" %>

        <!DOCTYPE html>

        <html xmlns="http://www.w3.org/1999/xhtml">
        <head runat="server">
         <title></title>
         <script language="javascript" type="text/javascript">
         function ANFormula(id1, id2, idResult) {
            var num1 = document.getElementById(id1);
            var num2 = document.getElementById(id2);

            var t1 = 0, t2 = 0, t3 = 0;

            if (num1.value != "")
                t1 = num1.value;
            if (num2.value != "")
                t2 = num2.value;
            t3 = parseInt(t1) + parseInt(t2);

            document.getElementById(idResult).value = t3;
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table>
                <tr>
                    <td>
                        <asp:Label ID="Label2" runat="server" Text="A3">
        </asp:Label>
                        <asp:TextBox ID="A3" runat="server" 
        onblur="ANFormula('<%=A3.ClientID %>', '<%=A4.ClientID %>', 
        '<%=A5.ClientID %>')"></asp:TextBox>

                    </td>  
                    <td>
                        <asp:Label ID="Label3" runat="server" Text="A4">
    </asp:Label>
                        <asp:TextBox ID="A4" runat="server" 
        onblur="ANFormula('<%=A3.ClientID %>', '<%=A4.ClientID %>', 
        '<%=A5.ClientID %>')"></asp:TextBox></td>
                    <td>
                        <asp:Label ID="Label4" runat="server" Text="A5">
                       </asp:Label>
                        <asp:TextBox ID="A5" runat="server"></asp:TextBox></td>
                   </tr>
               </table>
            </div>
         </form>
    </body>
</html>

javascript

asp.net

回答 3

Stack Overflow用户

发布于 2017-10-05 21:56:26

您将需要编辑textbox标记，如下所示：

<asp:TextBox ID="A3" runat="server" CssClass="inputcss" onblur="A5Formula(this);" CausesValidation="True" AutoCompleteType="Disabled"></asp:TextBox>

通过将" this“作为参数添加到函数中，可以将对象传递给函数(在本例中为textbox A3)。

在javascript函数中：

function A5Formula(e){
if (e.id=="A3" || e.id=="A4"){
//some processing code here depending on its id and do it for other ids
}
}

它将检查传递的对象的id，以便能够控制要更改的文本框值。

票数 0

Stack Overflow用户

发布于 2017-10-05 21:58:09

首先，您需要告诉parseInt您希望将数字解析为十进制数字parseInt(t1, 10)。

然后，您可以使用data-属性对这些控件进行分组，例如，使用data-add-operation来标识操作数，使用data-add-operation-result来标识结果字段。

<asp:TextBox ID="A3" data-add-operation="8" runat="server" CssClass="inputcss" onblur="formula(event)" CausesValidation="True" AutoCompleteType="Disabled"></asp:TextBox>

<asp:TextBox ID="A4" data-add-operation="8" runat="server" CssClass="inputcss" onblur="formula(event)" CausesValidation="True" AutoCompleteType="Disabled"></asp:TextBox>

<asp:TextBox ID="A5" data-add-operation-result="8" runat="server" CssClass="inputcss" Enabled="False" AutoCompleteType="Disabled" ></asp:TextBox>

在javascript中

function formula(e) {
    var total = 0;
    var groupId = $(e.sourceTarget).data("data-add-operation");

    $.each($("[data-add-operation=" + groupdId + "]", function(index, item) {
        total += parseInt(item.val(), 10);
    });

    $("[data-add-operation-result=" + groupdId + "]").val(total);
}

票数 0

Stack Overflow用户

发布于 2017-10-05 22:29:00

JavaScript

function ANFormula(id1, id2, idResult, idHidden) {
  var num1 = document.getElementById(id1);
  var num2 = document.getElementById(id2);

  var t1 = 0, t2 = 0, t3 = 0;

  if (num1.value != "") 
    t1 = num1.value;
  if (num2.value != "") 
    t2 = num2.value;
  t3 = parseInt(t1) + parseInt(t2);

  document.getElementById(idResult).value = t3;
  document.getElementById(idHidden).value = t3;
}

ASP.NET

<asp:TextBox ID="A3" runat="server" CssClass="inputcss"  CausesValidation="True" AutoCompleteType="Disabled"
  onblur="ANFormula('<%=A3.ClientID %>', '<%=A4.ClientID %>', '<%=A5.ClientID %>', '<%=A5hidden.ClientID %>')"></asp:TextBox>

<asp:TextBox ID="A4" runat="server" CssClass="inputcss" CausesValidation="True" AutoCompleteType="Disabled"
  onblur="ANFormula('<%=A3.ClientID %>', '<%=A4.ClientID %>', '<%=A5.ClientID %>', '<%=A5hidden.ClientID %>"></asp:TextBox>

<asp:TextBox ID="A5" runat="server" CssClass="inputcss" Enabled="False" AutoCompleteType="Disabled" ></asp:TextBox>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/46587120

复制

相似问题

问javascript calculation asp.net文本框
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问javascript calculation asp.net文本框EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问javascript calculation asp.net文本框
EN