使用 Javascript 在文本框中的 Onkeypressed 事件上强制数字精度

Question

我需要的是在用户输入文本框时强制用户 -

1. 最多可以放16个

2. 如果他们按 .他们可以在点后添加额外的 2 位数字

所以到目前为止我所做的是

<asp:TextBox ID="textbox" runat="server" Width="200" onkeypress="validateCurrencyX(this,7, 2);" >0.00</asp:TextBox>

javascript代码是

function validateCurrencyX(sender,prefix, suffix){
var something = document.getElementById('textbox').value;
           var valueArr = something.split('.');

            if (valueArr[1]!= null && valueArr[1].length > suffix-1)
                event.returnValue = false;

            if (valueArr[0].length > prefix-1)
                event.returnValue = false;
    }

反正我的代码有问题 - 当我选择整个文本或部分文本并按下某个东西时，它不会改变任何东西

他们有什么普通的方法吗？我对 javascript 和 asp.net 都很陌生 谢谢关注

Answer 1

由于您对 javascript 和 .net 都是新手，因此最好不要尝试重新发明轮子。

如果您愿意使用 jQuery，请查看NumberFormatter

$(".amt").blur(function(){
    $(this).format({format:"#,###,###,###,###,###.00", locale:"us"});
});

Answer 2

这是你想要的：

<asp:TextBox ID="textbox" runat="server" Width="200" oninput="validateCurrencyX(this,7, 2);" onkeydown="validateCurrencyX(this,7, 2);" >0.00</asp:TextBox>

JavaScript：

var validateCurrencyX = (function() {
    // Closure for local oldVal variable
    var oldVal = 0;
    return function validateCurrencyX(sender, prefix, suffix) {
        setTimeout(function() {
            // Convert to number
            var val = sender.value * 1,
            // Get decimals
                dec = sender.value.split('.')[1];
            if(
                val != val // NaN
                || val > 16
                || val < 0
                || dec && dec.length > suffix // check number of decimals
            ) {
                // If the new input doesn't fit the criteria, revert to the old input.
                sender.value = oldVal;
            } else {
                if(Math.floor(val) != 0 && sender.value.charAt(0) == '0') {
                    // If it's a number >= 1, remove leading '0's.
                    sender.value = sender.value.replace(/^0+/, '');
                }
                // Value is good. Save it in case we need to revert later.
                oldVal = sender.value;
            }
        }, 0);
    };
})();

这是一个工作示例：http://jsfiddle.net/6HUUT/4/

获得用户友好的实时文本验证器的关键是 (1) 使用 onkeydown / oninput 而不是 onkeypress，因为 @987654327 @ 不会因为粘贴和删除等内容而触发，并且 (2) 使用间隔为 0 的 setTimeout 检查用户实际输入的内容，并在文本框中更新后更改它，而不是试图阻止他们从一开始就输入它。同样，这有助于粘贴和删除等操作，以及在开头以外的位置插入字符，通常会让您的生活更轻松。这个想法只是让用户进行更改，然后检查它们以确保它们正常。

注意，onkeydown 和 oninput 用于旧版浏览器。 input 对于现代浏览器来说已经足够了，但是旧的浏览器（大约 IE8）不支持它。

Answer 3

这是没有使用 javascript，因为你说过 - 他们有什么普通的方法吗？所以看看这个：

1) 他们可以输入的最大数字是 16：为此，您拥有文本框的 maxlength 属性。将其设置为 16

2) 这段代码将限制您的用户在文本框中仅输入小数点后 2 位。

//In key press event of your TextBox:
if (e.KeyChar == '.' && (sender as TextBox).Text.IndexOf('.') > -1)
{
    e.Handled = true;
}
if (!char.IsControl(e.KeyChar))
{
    TextBox tt = (TextBox)sender;
    if (tt.Text.IndexOf('.') > -1 && tt.Text.Substring(tt.Text.IndexOf('.')).Length >= 3)
     {
       e.Handled = true;
     }
 }