将文本框值乘以标签并将结果动态填充到另一个文本框中答案

【问题标题】：multiply textbox value by label and dynamically populate the result in another textbox将文本框值乘以标签并将结果动态填充到另一个文本框中
【发布时间】：2017-05-30 22:06:24
【问题描述】：

我有两个文本框和一个隐藏标签。
通常我用 asp.net 来做这个：

用户在第一个textboxt1 中输入数字后，单击按钮getprice 后，系统将textbox1 的值乘以隐藏的标签编号，并在textbox2 中显示结果，反之亦然。

但我想通过使用 jquery 或 angularjs 在不使用按钮回发的情况下实现同样的目的。
当用户在textbox1 上键入数字时，系统应该在运行时将该值相乘，并在按键时将其显示在textbox2 中。

请给我一个函数。

我尝试过使用这个 jQuery... 它不工作。
我希望函数有一个名字，所以我可以在textbox1 上按下按键。

<script type="text/javascript">
  $(function () {
    $("#<%=Textbox.ClientID%>").bind("input", function() {
      var value1 = $("#<%=Textbox.ClientID%>").val()
      var value2 = $("#<%=HiddenTextbox2.ClientID%>").val();
      $("#<%=Textbox3.ClientID%>").val(value1 * value2);
    });
  });
</script>

【问题讨论】：

你准备好使用 JQuery 了吗？ JavaScript 可以很好地处理这个函数。
请任何人使用 javascript 或 jquery...
在这种情况下，请参阅下面的答案。

标签： jquery asp.net vb.net

【解决方案1】：

我想用 JavaScript 来回答会更容易。这是一个可行的功能：

<script type="text/javascript">
    function MultiplyByHidden() {
        var value1 = parseFloat(document.getElementById("<%=Textbox.ClientId%>").value)
        var value2 = parseFloat(document.getElementById("<%=HiddenTextbox2.ClientId%>").value)
        var total = value1 * value2 
        document.getElementById("<%=Textbox3.ClientId%>").value = total
    }
</script>

此功能可以满足您的所有需求，并且不需要导入额外的库（如 JQuery）来处理如此简单的功能。

编辑我忘了它也会乘以字符串。

【讨论】：

它也会尝试将字符串相乘......即使在香草JS中也是如此。 jQuery 不是问题。 OP问题是变量类型。
嘿 wenadin，我刚刚使用了你的函数，因为我在 textbox1 中插入了数字，textbox2 向我显示了这个“NAN”。你知道怎么了？
NaN 代表非数字。看起来乘法出了点问题。如果您在其中放入非数字的内容或 parseFloat 未在该值上运行，则会发生相同的结果。尝试在页面上打开开发者工具（F12）并检查 value1 和 value2 中包含的值。

【解决方案2】：

我认为您尝试将字符串相乘...

建议在文本输入中使用parseInt() 或parseFloat() ;)

<script type="text/javascript">
  $(function () {
    $("#<%=Textbox.ClientID%>").on("input", function() {
      var value1 = parseFloat( $("#<%=Textbox.ClientID%>").val() );
      var value2 = parseFloat( $("#<%=HiddenTextbox2.ClientID%>").val() );
      $("#<%=Textbox3.ClientID%>").val(value1 * value2);
    });
  });
</script>

【讨论】：

我刚刚使用了你的函数，当我在 textbox1 中插入数字时，textbox2 向我展示了这个“NAN”。你知道怎么了？
NAN 表示“不是数字”...如果您不确定它是什么，请尝试控制台记录该值...您可能需要删除您希望的数字字体中的字符有。可悲的是，该数字位于字符串的开头。所以parseFloat("10.50$") => 10.5 但parseFloat("£10.50") => NAN

【解决方案3】：

$("#pay,#pre").keyup(function () {

$('#pay').val($('#pay').val() * $('#pre').val());

});

块引用

【讨论】：