javascript 如何使用 jQuery MaskedInput 1.3 正确设置十进制掩码

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8952060/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 05:07:42  来源:igfitidea点击:

How to properly set up a decimal mask using jQuery MaskedInput 1.3

javascriptjqueryasp.net-mvcasp.net-mvc-3jquery-plugins

提问by Brendan Vogt

I am using jQuery 1.7.1and jQuery maskedinput 1.3in my ASP.NET MVC 3app.

我正在使用jQuery 1.7.1jQuery maskedinput 1.3在我的ASP.NET MVC 3应用程序中。

How would I set up a masked item that accepts a decimal value (SQL decimal 10,2). What I have works but it looks horrible:

我将如何设置接受十进制值(SQL 十进制 10,2)的屏蔽项。我有什么工作,但它看起来很可怕:

$('#AnnualIncome').mask('9?9999999.99', { placeholder: ' ' });

When I go to my page and click on the textbox then there is space for numeric values with a . further on for the decimal part. This looks horrible and it doesn't seem to work well. I will type in 9 for the left part of the decimal and then 99 for the right part of the decimal. So if the textbox still has the focus then it looks something like this:

当我转到我的页面并单击文本框时,就会出现带有 . 进一步的小数部分。这看起来很可怕,而且似乎效果不佳。我将为小数点的左边部分输入 9,然后为小数点的右边部分输入 99。因此,如果文本框仍然具有焦点,则它看起来像这样:

9___________.99

I don't want it like this, I want the user to be able to type in a decimal anytime, I want something like:

我不希望这样,我希望用户能够随时输入小数,我想要类似的东西:

9.99

Also, if the textbox looses focus, then it now looks like:

此外,如果文本框失去焦点,那么它现在看起来像:

999

I need it to display:

我需要它来显示:

9.99

Can someone please help me set this up properly?

有人可以帮我正确设置吗?

回答by Julian D.

The Masked Input jQuery Pluginis meant for fixed widthinput, like formatting phone numbers. Have a look at e.g. the numeric Pluginor the autoNumeric Plugininstead.

所述屏蔽输入jQuery插件是为固定宽度的输入,如格式化电话号码。看看例如numeric PluginautoNumeric Plugin

回答by Rob Willis

The Masked Input jQuery Plugincan be configured to support variable width decimal places.

所述屏蔽输入jQuery插件可被配置成支持可变宽度位小数。

Firstly add a mask definition that supports your local decimal place separator or numeric characters:

首先添加一个支持本地小数位分隔符或数字字符的掩码定义:

$.mask.definitions['d'] = '[0-9.]';

Then define the mask:

然后定义掩码:

$('#AnnualIncome').mask('9?dddddddd', ' ');

Decimal places are optional and you cannot control the number of decimal places but still useful in certain scenarios and saves adding another plugin.

小数位数是可选的,您无法控制小数位数,但在某些情况下仍然有用,并且可以节省添加另一个插件。