JavaScript添加兩個文本框的值，並在第三顯示在asp.net

我如何在javascript/asp中添加兩個文本框的值，並在第三顯示？JavaScript添加兩個文本框的值，並在第三顯示在asp.net

我的JS代碼

function sum() { 
     var txtFirstNumberValue = document.getElementById('TextBox1').value; 
     var txtSecondNumberValue = document.getElementById('TextBox2').value; 
     var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue); 
     if (!isNaN(result)) { 
      document.getElementById('TextBox3').value = result; 
     } 
    }

ASP頁面加載

TextBox1.Attributes.Add("onkeyup", "sum();"); 
TextBox2.Attributes.Add("onkeyup", "sum();");

來源

2017-08-15 Raid

使用'ClientID'像'變種txtFirstNumberValue =的document.getElementById（ '<％= TextBox1.ClientID％>'）。value'應ASPX頁面的WebForms工作（如果你不設置'的ClientIDMode =」靜態「'）。 –

一個你應該知道的事情：

默認情況下，ASP.NET使用自動生成的ClientID財產使用通過TextBox控制在ASPX頁面中，以便您的文本框ID在呈現後變成類似<input id="ctl00_ContentPlaceHolder1_TextBox1" type="text" ... />的東西。要在客戶端使用服務器控件名稱需要使用ClientID這樣的：

function sum() { 
    var txtFirstNumberValue = document.getElementById('<%= TextBox1.ClientID %>').value; 
    var txtSecondNumberValue = document.getElementById('<%= TextBox2.ClientID %>').value; 
    var result = parseInt(txtFirstNumberValue) + parseInt(txtSecondNumberValue); 
    if (!isNaN(result)) { 
     document.getElementById('<%= TextBox3.ClientID %>').value = result; 
    } 
}

另一種避免使用在客戶端生成ClientID被設置ClientIDMode是靜態的，下面舉例來使用它：

<%-- control level --%> 
<asp:TextBox ID="TextBox1" runat="server" ClientIDMode="Static" ... /> 

<%-- placeholder level --%> 
<asp:Content ID="Content1" runat="server" ClientIDMode="Static" ...>...</asp:Content> 

<%-- page level --%> 
<%@ Page Language="C#" ClientIDMode="Static" AutoEventWireup="true" ... %>

參考：

ClientID Property

Set HTML Attributes for Controls in ASP.NET Web Pages

來源

2017-08-15 09:52:00

您可以在aspx以下代碼中使用，而不使用後面的代碼。

<asp:textbox id="TextBox1" cssclass="sum" runat="server" /> 
<asp:textbox id="TextBox2" cssclass="sum" runat="server" /> 
<asp:textbox id="txtResult" runat="server" /> 

<script> 
    $(document).ready(function() { 
     //this calculates values automatically 
     calculateSum(); 

     $(".sum").on("keydown keyup", function() { 
      calculateSum(); 
     }); 
    }); 

    function calculateSum() { 
     var sum = 0; 
     //iterate through each textboxes and add the values 
     $(".sum").each(function() { 
      //add only if the value is number 
      if (!isNaN(this.value) && this.value.length != 0) { 
       sum += parseFloat(this.value); 
       $(this).css("background-color", "#FEFFB0"); 
      } 
      else if (this.value.length != 0) { 
       $(this).css("background-color", "red"); 
      } 
     }); 

     $("#<%=this.txtResult.ClientID%>").val(sum.toFixed(2)); 
    } 
</script>

來源

2017-08-15 09:55:18

JavaScript添加兩個文本框的值，並在第三顯示在asp.net

回答

相關問題