Javascript 如何减去asp文本框值并将结果放入asp标签

我试图从两个文本框中获取值，减去值，并在键入值时返回a标签中的差值。我已经尝试了下面的代码，但运气不好。最好的方法是什么？这是在带有母版页的asp.net页上运行的

.ASPX

---

您可以在文本框控件中设置onkeyup

 <asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px"  OnTextChanged="OUTvalidation" onkeyup="sum(); return false" >0.00</asp:TextBox>

0.00

您是否用

onkeypress=“SUM（）”

尝试过这一点：

ASP:

0.00
0

脚本：

function SUM() {
      var num1 = $('input[id=<%=txtWeek1FridayAM_IN.ClientID%>]').val();
      var num2 = $('input[id=<%=txtWeek1FridayAM_OUT.ClientID%>]').val();
      var result = parseFloat(num2) - parseFloat(num1);
      if (!isNaN(result)) {
         document.getElementById('<%=lblWeek1FridayTotalHrs.ClientID %>').value = result;
      }
}

函数和（）{
var num1=$（'input[id=]）.val（）；
var num2=$（'input[id=]）.val（）；
var result=parseFloat（num2）-parseFloat（num1）；
如果（！isNaN（结果））{
document.getElementById（“”）.value=result；
}
}

请注意:

• 您可以在定义控件时指定javascript方法，无需依赖document.ready。就像我们所做的那样
• 由于您使用的是ASP控件，因此该控件的ID可能与您定义的ID不同。母版页也可能在这方面发挥作用。所以最好使用

  ClientID

使用此脚本

$(document).ready(function () {
    sum();
    $('[id$="txtWeek1FridayAM_IN"], [id$="txtWeek1FridayAM_OUT"]').on("keyup", function () {
        sum();
    });
});

function sum() {
    var num1 = $('[id$="txtWeek1FridayAM_IN"]').val();
    var num2 = $('[id$="txtWeek1FridayAM_OUT"]').val();
    var result = parseFloat(num2) - parseFloat(num1);

    if (!isNaN(result)) {
        $('[id$="lblWeek1FridayTotalHrs"]').html(result);

    }

}

几点：

如果需要在客户端脚本中引用控件ID，可以使用

label

或

span

元素没有

值

属性，请改用

textContent

我更喜欢

input

而不是

keyup

和

keydown

我在运行代码时遇到了一些问题。但是可以通过从控件中删除它来成功执行

将代码更改为以下内容：

$(document).ready(function () {
    sum();
    $("body").on("input", "#<%=txtWeek1FridayAM_IN.ClientID%>, #<%=txtWeek1FridayAM_OUT.ClientID%>", function () {
       sum();
    });
});

function sum() {
    var num1 = document.getElementById('<%=txtWeek1FridayAM_IN.ClientID%>').value;
    var num2 = document.getElementById('<%=txtWeek1FridayAM_OUT.ClientID%>').value;
    var result = parseFloat(num2) - parseFloat(num1);

    if (!isNaN(result)) {
        document.getElementById('<%=lblWeek1FridayTotalHrs.ClientID%>').textContent = result;
    }
}

$（文档）.ready（函数（）{
sum（）；
$（“body”）。在（“输入”、“函数”、“函数”）上{
sum（）；
});
});
函数和（）{
var num1=document.getElementById（“”）.value；
var num2=document.getElementById（“”）.value；
var result=parseFloat（num2）-parseFloat（num1）；
如果（！isNaN（结果））{
document.getElementById（“”）.textContent=结果；
}
}

试试这个，这个会有用的 .aspx页

<asp:TextBox ID="txtWeek1FridayAM_IN" runat="server" class="numeric" Width="40px" >0.00</asp:TextBox>
<asp:Label ID="lblWeek1FridayTotalHrs" runat="server" class="numeric" Text="0"></asp:Label>                  
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px"  OnTextChanged="OUTvalidation" >0.00</asp:TextBox>

如果在两个文本框中都输入值，然后在第二个文本框中单击enter，则会在标签上显示值

$(document).ready(function () {
    sum();
    $('[id$="txtWeek1FridayAM_IN"], [id$="txtWeek1FridayAM_OUT"]').on("keyup", function () {
        sum();
    });
});

function sum() {
    var num1 = $('[id$="txtWeek1FridayAM_IN"]').val();
    var num2 = $('[id$="txtWeek1FridayAM_OUT"]').val();
    var result = parseFloat(num2) - parseFloat(num1);

    if (!isNaN(result)) {
        $('[id$="lblWeek1FridayTotalHrs"]').html(result);

    }

}

$(document).ready(function () {
    sum();
    $("body").on("input", "#<%=txtWeek1FridayAM_IN.ClientID%>, #<%=txtWeek1FridayAM_OUT.ClientID%>", function () {
       sum();
    });
});

function sum() {
    var num1 = document.getElementById('<%=txtWeek1FridayAM_IN.ClientID%>').value;
    var num2 = document.getElementById('<%=txtWeek1FridayAM_OUT.ClientID%>').value;
    var result = parseFloat(num2) - parseFloat(num1);

    if (!isNaN(result)) {
        document.getElementById('<%=lblWeek1FridayTotalHrs.ClientID%>').textContent = result;
    }
}

<asp:TextBox ID="txtWeek1FridayAM_IN" runat="server" class="numeric" Width="40px" >0.00</asp:TextBox>
<asp:Label ID="lblWeek1FridayTotalHrs" runat="server" class="numeric" Text="0"></asp:Label>                  
<asp:TextBox runat="server" ID="txtWeek1FridayAM_OUT" class="numeric" width="40px"  OnTextChanged="OUTvalidation" >0.00</asp:TextBox>

protected void OUTvalidation(object sender, EventArgs e)
{
    int val1 = Convert.ToInt32(txtWeek1FridayAM_IN.Text);
    int val2 = Convert.ToInt32(txtWeek1FridayAM_OUT.Text);
    int val3 = val1 - val2;
    lblWeek1FridayTotalHrs.Text = val3.ToString();
}