我有一个脚本,我可以在一个文本框中输入一个数字,它将计算其他文本框中的等效值。
$("input[type=text]").keyup(function () {
var number = parseFloat($(this).val());
var inc = parseFloat($(this).attr("inc"));
var newValue = number / inc;
$("input[type=text]").each(function () {
if(isNaN(newValue * parseFloat($(this).attr("inc"))))
$(this).val(0);
else
$(this).val(newValue * parseFloat($(this).attr("inc")));
});
});
可以检查:JSFiddle Here
目前它不允许使用十进制数字。但我真的需要它。而且我不知道如何允许小数。
此外,我需要该框的小数点后 2 位数字的限制。
最佳答案
TL;DR: 如果您只想修复,请跳到实际代码。以下段落解释了为什么会发生这种情况。
十进制数字不起作用的原因是每次文本框被单个字符编辑时,所有文本框中的所有数字都会转换为 float 。如果您在其中一个框中输入 1
,该值将传递给 parseFloat
并转换为 1
(相同的值)。如果您随后按 3
字符,文本框会显示 13
,该值会传递给 parseFloat
并返回相同的值 13
.
但是,如果您开始输入 13.
,它将传递给 parseFloat
; JavaScript 意识到句点是不必要的*
,并将值13
放入文本框中。无论您输入的速度有多快,JavaScript 都会一直想要 trim 掉“不必要的”句点,然后您才能在末尾添加额外的数字。
您可以通过仅在您当前未输入的文本字段上运行parseFloat
函数(或以任何方式更改值)来解决此问题。我已经强调了“奇迹发生”的两行:
$("input[type=text]").keyup(function () {
var number = parseFloat($(this).val());
var inc = parseFloat($(this).attr("inc"));
var newValue = number / inc;
var current = this; // <---- "current" is the text field that is currently being edited
$("input[type=text]").each(function () {
if(this != current) { // <--------------
if (isNaN(newValue * parseFloat($(this).attr("inc"))))
$(this).val(0);
else
$(this).val(newValue * parseFloat($(this).attr("inc")));
}
});
});
还有代码的 JS Fiddle,以便您可以测试它:http://jsfiddle.net/RX2sL/27/
*
技术上由于 String -> Float -> String
转换,句点被 trim 掉,但更容易想到期间被认为是“不必要的”。
关于javascript - isNaN 允许小数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24009356/