2017-09-05 87 views
2

嗨我的脚本有问题,我想在每个文本框上对每个文本框进行的每个更改都同时舍入文本框上的所有结果。将所有计算的文本框小数位舍入为2

我正在谈论数百个文本框,这些文本框会在文本框的每次更改/输入之后舍入。

无论如何,这里是我的工作示例代码。

HTML:

<input type="text" id="textbox" value="1.1251112314555" /> 
<br/> 
<input type="text" id="textbox2" value="1" /> 
<br/> 
<input type="text" id="textbox3" value="1" readonly/> 
<br/> 
<input type="text" id="textbox4" value="1" readonly/> 
<br/> 

的Javascript:

$("input[type=text]").blur(function() { 

    totalad3 = parseInt(textbox) * parseInt(textbox2); 
    totalad4 = parseInt(textbox) + parseInt(textbox2); 

    $('#textbox3').val(totalad3); 
    $('#textbox4').val(totalad4+"%");  

    var num = parseFloat($("input[type=text]").val()); 
    var new_num = $("input[type=text]").val(num.toFixed(2)); 
}); 

enter image description here

+1

有两件事:1. JavaScript和jQuery不是彼此的替代品。你的意思是“使用DOM”和“使用jQuery”,你使用的是JavaScript两种方式2.你有“使用DOM”和“使用jQuery”向后,“getElementById”直接使用DOM。 ...)'正在使用jQuery –

+0

什么意思是“不工作”? –

+0

什么过程填充文本框?为什么不将舍入应用于该过程并在文本框中应用小数掩码,以便没有人可以添加多于2个小数位在第一位吗? – Nope

回答

3
,如果你想用的任何输入的模糊事件四舍五入值每个输入更新值,在处理函数

获取所有输入,然后迭代每个输入并更改其值。是这样的:

$('input[type=text]').on('blur', function() { 
 
    var inputs = $('input[type=text]'); 
 
    inputs.each(function(){ 
 
     var num = parseFloat($(this).val()); 
 
     var new_num = num.toFixed(2); 
 
     $(this).val(new_num); 
 
}) 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input type="text" id="textbox" value="1.1251112314555" /> 
 
<br/> 
 
<input type="text" id="textbox2" value="1" /> 
 
<br/> 
 
<input type="text" id="textbox3" value="1" readonly/> 
 
<br/> 
 
<input type="text" id="textbox4" value="1" readonly/> 
 
<br/> 
 
<input type="button" id="calculate" value="Calculate"/>

+0

这就是我正在寻找的,我试图将它应用于我的计算,谢谢! –

+1

非常感谢你@Dij你的代码完全符合我的脚本,我非常感谢你的帮助。 –

0

数百个文本框的每一个变化/输入后,将四舍五入的 文本框。

如果我正确理解您的要求..

$("input[type=text]").blur(function() { 
 
     
 
     \t // console.log("Which textbox has changes?", $(this).val()); 
 
      
 
     // Get current input value 
 
     var currentInputValue = parseFloat($(this).val()); 
 
      
 
     // Round them to 2 decimal 
 
     var roundedValue = currentInputValue.toFixed(2); 
 
      
 
     // Update back to textbox 
 
     $(this).val(roundedValue); 
 
      
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="textbox" value="1.1251112314555" /> 
 
<br/> 
 
<input type="text" id="textbox2" value="1" /> 
 
<br/> 
 
<input type="text" id="textbox3" value="1" readonly/> 
 
<br/> 
 
<input type="text" id="textbox4" value="1" readonly/> 
 
<br/> 
 
<input type="text" id="textbox5" value="123.2323" /> 
 
<br/> 
 
<input type="text" id="textbox6" value="1.444" /> 
 
<br/> 
 
<input type="text" id="textbox7" value="23.23235" /> 
 
<br/> 
 
<input type="button" id="calculate" value="Calculate"/>

+0

是的,我有一些文本框,填充了很多文本框,我想发的是只有在我已经完成的计算后才舍入到2个小数位。无需按钮触发,我想要发生的是脚本将执行所有文本框每个onblue单个文本框 –

0

使用Array.from有地图显示功能的另一种方式。

<script type="text/javascript"> 
    $(function() { 
     $("input[type=text]").on('blur', function(){ 
      Array.from($("input[type=text]"), (el, i) => $(el).val(parseFloat($(el).val()).toFixed(2))); 
     }) 
    }); 
</script> 

<input type="text" id="textbox" value="1.1251112314555" /> 
<br/> 
<input type="text" id="textbox2" value="1" /> 
<br/> 
<input type="text" id="textbox3" value="1" readonly/> 
<br/> 
<input type="text" id="textbox4" value="1" readonly/> 
<br/> 
<input type="button" id="calculate" value="Calculate" />