在JavaScript中不使用parseFloat不能正确加两个数字 [英] Cannot add two numbers correctly without using parseFloat in JavaScript

问题描述

我遇到了这个问题.它使用parseFloat或parseInt添加数字. 如果textbox1的值为4而textbox2的值为2，那么我得到的输出为(参见脚本)

I came across this problem. It adding numbers using parseFloat or parseInt. IF textbox1 value is 4 and textbox2 value is 2 then i got output as (see script)

我的疑问是，为什么仅添加

My doubt is why in addition alone

parseFloat($('#txt1').val()) + parseFloat($('#txt2').val())

给出正确的值，但

parseFloat($('#txt1').val() + $('#txt2').val())

没有给出正确的值，而

• parseFloat($('#txt1').val() - $('#txt2').val())，
• parseFloat($('#txt1').val() / $('#txt2').val())，
• parseFloat($('#txt1').val() * $('#txt2').val())

• parseFloat($('#txt1').val() - $('#txt2').val()),
• parseFloat($('#txt1').val() / $('#txt2').val()),
• parseFloat($('#txt1').val() * $('#txt2').val())

给出正确的值. 它很简单，但是我找不到解决方案.

are giving correct value. Its simple but i couldn't find solution.

===== jQuery

=====jQuery

   function Calculate() {                                              //--> Output
     $('#lbl1').html(parseFloat($('#txt1').val() + $('#txt2').val())); //--> 42
     $('#lbl2').html(parseFloat($('#txt1').val()) + parseFloat($('#txt2').val())); //--> 6
     $('#lbl3').html(parseFloat(4 + 2));                               //--> 6

     $('#lbl4').html(parseFloat($('#txt1').val() - $('#txt2').val())); //--> 2
     $('#lbl5').html(parseFloat($('#txt1').val() * $('#txt2').val())); //--> 8
     $('#lbl6').html(parseFloat($('#txt1').val() / $('#txt2').val())); //--> 2
  }

===== HTML

=====HTML

<table>
        <tr>
            <td>
                <input type="text" id="txt1" />
            </td>
            <td>
                <input type="text" id="txt2" />
            </td>
        </tr>
        <tr>
            <td>
                <input type="button" value="Calculate"  onclick="Calculate()" />
            </td>
            <td>
                <label id="lbl1">
                </label>
                |
                <label id="lbl2">
                </label>
                |
                <label id="lbl3">
                </label>
                |
                <label id="lbl4">
                </label>
                |
                <label id="lbl5">
                </label>
                |
                <label id="lbl6">
                </label>
            </td>
        </tr>
    </table>

推荐答案

$.val()返回字符串值.

因此，在您的第一个示例中，您将两个返回的字符串都转换为数字，并且计算很好.

So in your first example you convert both returned strings to numbers and the calculation is fine.

如果使用parseFloat($('#txt1').val() + $('#txt2').val())，则+不能用作算术运算符，而可以用作字符串连接.因此，您将两个字符串连接起来，然后再进行转换，这将导致错误的结果.

If you use parseFloat($('#txt1').val() + $('#txt2').val()) the + does not work as the arithmetic operator, but as a string concatenation. So you concatenate both strings and convert them afterwards, which gives a wrong result.

使用-的示例将起作用，因为没有使用-的字符串操作，因此所有值在应用该操作之前都隐式转换为一个数字.

The examples using - will work, as there is no string operation using - and by thus alls values get implicitly converted to a number before the operation is applied.

这篇关于在JavaScript中不使用parseFloat不能正确加两个数字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！