c# - Javascript 的 Onfocus() 事件不计算文本框值

Question

在我的 asp.net 网站中，我尝试将两个文本框值相乘并将其存储到另一个文本框中。但是，我的代码不起作用

JS:

<script language="javascript">
function myFunction(x)
{
var x = document.getElementById("<%=u_price1.ClientID %>") * document.getElementById("<%=qty1.ClientID %>");
return x;
}
</script>

文本框:

<asp:TextBox ID="u_price1" runat="server" Width="63px" CssClass="txt1">0</asp:TextBox>

<asp:TextBox ID="qty1" runat="server" Width="63px" CssClass="txt1">0</asp:TextBox>

<asp:TextBox ID="amt1" runat="server" Width="81px" CssClass="txt1" onfocus="myFunction(this)"></asp:TextBox>

请告诉我我在这里做错了什么。

Answer 1

让我惊讶的明显事情是您对两个 DOM 元素使用乘法运算符 (*)，这将返回 NaN。也就是说，

document.getElementById("<%=u_price1.ClientID %>")

返回一个对象，而不是该文本框内容的数值。我认为您想要做的是获取文本框的值:

var x = document.getElementById("<%=u_price1.ClientID %>").value *
    document.getElementById("<%=qty1.ClientID %>").value;

如果您想真正采取防御措施，您可以检查以确保它们是有效的数字:

var price = Number( document.getElementById("<%=u_price1.ClientID %>").value );
var qty = Number( document.getElementById("<%=qty1.ClientID %>").value );

然后您可以检查以确保它们是有效的数字:

if( isNaN( price ) || isNaN( qty ) ) {
    // take appropriate error handling action here
}

但是，您的脚本可能还存在其他问题。我会将 console.log 放入 myFunction 中，以确保它被调用。如果它没有被调用，那么就有其他问题了，但你肯定必须解决对象乘法问题。