Home > Web Front-end > JS Tutorial > js number input box (including maximum and minimum value limits and rounding)_javascript skills

js number input box (including maximum and minimum value limits and rounding)_javascript skills

WBOY
Release: 2016-05-16 18:41:17
Original
2193 people have browsed it

Since the original text has been introduced very well, now there are just some translations and small additions.
Example

Copy code The code is as follows:




Demo




< ;body>






< ;td>
Use the Strip() method to remove the format, such as '1,123' becomes '1123' (only the content of the first text box is displayed):








Format: 9999.99 (range 0-9999.99) (dynamic modification alt attribute):



< input type="button" value='Change attributes' onclick="change();"/>



Format numbers, what is done here is rounding, for example, '5.6' becomes '6' (only the content of the first text box is displayed):






Features of this plugin:

. Only numbers, decimal separators (including decimal points), and negative signs can be entered.
. Supports different input formats for each text input on the same page. In other words, each input box on the page can be customized.
. Nine different number rounding rules (that is, those that are rounded)
. The maximum and minimum values ​​can be set for integers and decimals respectively ( Very useful)
. The input value can be only positive numbers, or positive and negative numbers.
. When there are only decimals and zeros, the leading character can be zero. However, if the input number is "900", delete "9" and it will retain 00.
. Supports pasting, but when pasting text, it will become "0.00".
. The public method Strip() can remove the format
. The public method Format() can format the required value.

Regarding the settings in the alt attribute:

There are a total of 7 characters in alt, which represent 7 formatting attributes:
The first one: the value is 'p' (only positive numbers can be entered) or 'n' (both positive and negative numbers can be entered)
The second one: the value is 0-9, respectively Represents the number of digits to the left of the decimal separator. (When it is '0', you can enter a 15-digit integer)
The third one: used as the separator for number grouping (the separator used for thousandths, etc.)
a: Single quote or apostrophe (can be used for timing and angle)
c: Comma (default)
p: Period (there will be a conflict if the decimal separator is also a period)
s: Space mark
x: None
The fourth one: the value is 2, 3 (default), 4, the number of numbers used for number grouping (for example, '3' is '123,123', and '4' is '12' ,3123','2' seems to be the way to divide it in India, see the original author)
The fifth one: the decimal point separator. The values ​​​​are c (comma) and p (period), p is the default.
The sixth one: the number of decimal places
: decimals are not allowed to be entered, that is to say, only integers can be entered
-9: the number of decimal places (default is 2, such as '1.23' )
a-Z: Including upper and lower case, it will find the number input box with ID 'dp[a-Z]' and use the number inside as the number of decimal places, which means that the number of decimal places can be modified dynamically.
Seventh: Nine different number rounding rules
S = Round-Half-Up Symmetric (default, generally used for rounding)
A = Round-Half-Up Asymmetric
s = Round -Half-Down Symmetric
a = Round-Half-Down Asymmetric
B = Round-Half-Even "Bankers Rounding" (Bankers Algorithm? Never used)
U = Round Up "Round-Away -From-Zero" (use this for the largest integer, of course it is not just an integer category, it can be accurate to decimal places)
D = Round Down "Round-Toward-Zero" (use this for the smallest integer)
C = Round to Ceiling "Toward Positive Infinity"
F = Round to Floor "Toward Negative Infinity"
There is an English article about this number rounding rule that you can refer to.
There are also some examples of pasting features and digital rounding that I will not introduce one by one. Those who are interested can read the author's original text.
Thank you very much to the author for providing such a good Jquery plugin.
Test code packaginghttp://xiazai.jb51.net/200911/yuanma/numeric-demo.rar
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template