使用 jquery 添加逗号以使用等式形成字段

Question

您好，目前无法正常使用我的表单。目标是在前 3 个字段中输入值并获得总数，同时在字段中显示逗号。然而总数接近 NaN 我认为这是由于逗号。任何帮助将不胜感激。

 $(document).ready(function(){
     $(".input").keyup(function(){
           var val1 = +$(".value1").val();
           var val2 = +$(".value2").val();
           var val3 = +$(".value3").val();
           $("#result").val(val1*val2*val3);
    });
 });
 $(document).on('keyup', '.comma', function() {
     var x = $(this).val();
     $(this).val(x.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ","));
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type="text" class="input value1 comma" >
<input type="text" class="input value2 comma">
<input type="text" class="input value3 comma">
<input type="text" class="comma" disabled="disabled" id="result">

Answer 1

一旦逗号出现在您的文本框值中，代码就无法再将它们转换为整数。一个简单的解决方法是在相乘时去除所有逗号。

尝试使用简单的 .replace() 从 val 变量中删除逗号，如下所示：

 $(document).ready(function(){
     $(".input").keyup(function(){
           var val1 = +$(".value1").val().replace(/,/g,"");
           var val2 = +$(".value2").val().replace(/,/g,"");
           var val3 = +$(".value3").val().replace(/,/g,"");
           $("#result").val(val1*val2*val3);
    });
 });
 $(document).on('keyup', '.comma', function() {
     var x = $(this).val();
     $(this).val(x.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ","));
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type="text" class="input value1 comma" >
<input type="text" class="input value2 comma">
<input type="text" class="input value3 comma">
<input type="text" class="comma" disabled="disabled" id="result">

使用 jquery 添加逗号以使用等式形成字段

Adding Commas to form fields with equation using jquery

forms

formatting

jquery

field