The regular limit is entered as a number, and a new notation of up to 2 decimal places is entered

Source: Internet
Author: User

Originally the small program needs a limit text box input as a number, and retain the effect of up to 2 decimal places, the example found on the internet feel a bit cumbersome, wrote a.

The code is simple, and is mainly handled by the regular group matching feature:

// Check input text, limit only to numbers and numbers with up to 2 decimal places  function (text) {    var reg =/^ (\.*) (\d+) (\.?) (\d{0,2}). *$/g;     if // regular Match Pass, extract valid text      Text = Text.replace (reg, ' $2$3$4 ');    }     Else // regular match does not pass, empty directly      Text = ';    }     return // returns the text that meets the requirements (numeric and with a maximum of 2 decimal places)  }

1, the example used in the Small program demo:

*.wxml File Code:

<view class= ' Row ' >        <view class= ' title ' > Text input limit input numbers with a maximum of 2 decimal places </view>        <input type= ' Digit ' placeholder= ' Please enter a valid number ' bindinput= ' inputnum ' class= ' numinput '/>    </view>
View Code

Corresponding *.js file key code:

//listening for text inputInputnum:function(e) {return  This. Checkinputtext (E.detail.value); },  //Check input text, limit only to numbers and numbers with up to 2 decimal placesCheckinputtext:function(text) {varReg =/^ (\.*) (\d+) (\.?) (\d{0,2}). *$/G; if(Reg.test (text)) {//regular Match Pass, extract valid textText = Text.replace (reg, ' $2$3$4 '); }    Else{//regular match does not pass, empty directlyText = ' '; }    returnText//returns the text that meets the requirements (numeric and with a maximum of 2 decimal places)}
View Code

2. Use the sample demo on the Web page:

<div> <br/> //Listen for text box input, limit its input to a number, and enter up to 2 decimal places only            functionInputtext (obj) {obj.value=Checkinputtext (Obj.value); }            //Check input text, limit only to numbers and numbers with up to 2 decimal places            functionCheckinputtext (text) {varReg =/^ (\.*) (\d+) (\.?) (\d{0,2}). *$/G; if(Reg.test (text)) {//regular Match Pass, extract valid textText = Text.replace (reg, ' $2$3$4 '); }                Else{//regular match does not pass, empty directlyText = ' '; }                returntext; }        </script>
View Code

3, String.prototype.replace () use

The Replace method of a string object can replace a matching value. It accepts two parameters,

The first parameter is the content to be replaced, can be expressed as a string, or a regular expression can be used to represent the search pattern;

The second parameter is the content that represents the first parameter to replace.

When using a regular expression, the second parameter of the Replace method can use the dollar sign $, which is used to refer to the substituted content:

$&: Matched substring $: matches the preceding text $': matches theresult of the text $n: matches the successful nth set of Contents, n is the natural number starting from 1 $$: The dollar sign $

Examples of how to use it:

//1, the matching Group interchange locationvarstr1 = ' Hello World '. Replace (/(\w+) \s (\w+)/, ' $ $ $ '); Console.log (' str1 = ' +str1); //str1 = World Hello//2. Overwrite the matching valuesvarSTR2 = ' abc '. replace (' B ', ' [$ '-$&-$\ '] '); Console.log (' str2 = ' +str2); //str2 = a[a-b-C]c//3. The second parameter of the Replace method can also be a function that replaces each match with a function return valuevarSTR3 = ' 3 and 5 '. Replace (/[0-9]+/g,function(match) {return2 *match;}); Console.log (' STR3 = ' +STR3); //STR3 = 6 and ten//4, replace the substitution method The second parameter of the replacement function, you can also accept multiple parameters. //The first parameter is the captured content, and the parameter after the second parameter represents the group match (how many groups match, how many corresponding parameters are matched)//Below is a sample page template replacementvarPrices = {  ' P1 ': ' ¥1.99 ',  ' P2 ': ' ¥9.99 ',  ' P3 ': ' ¥5.00 '};varTemplate = ' <span id= ' p1 ' ></span> ' + ' <span id= ' p2 ' ></span> ' + ' <span id= ' p3 ' &GT;&LT;/SPAN&G t; ';varSTR4 =Template.replace (/(<span id= ") (. *?) (">) (<\/span>)/G,function(Match, $, $, $ $, $4){    return$ + $ + $ + prices[$2] + $4; }); Console.log (' STR4 = ' +STR4);//STR4 = <span id= "P1" >¥1.99</span><span id= "P2" >¥9.99</span><span id= "P3" >¥5.00 </span>
View Code

Then you should understand the regular/^ (\.*) (\d+) (\.?) (\d{0,2}). *$/g means a total of 4 matching groups

var reg =/^ (\.*) (\d+) (\.?) (\d{0,2}). *$/G; /* The Regular expression reg contains 4 matching groups: (\.*): The first character that matches the input is a decimal point. The corresponding group match symbol $ (\d+): matches the input decimal points. The previous number, corresponding to the group match symbol, $ (\.?): Matches the decimal point, the corresponding group matches the symbol $ d{0,2}): matches the number after the decimal point, after the decimal limit several decimal repeat symbol {M,n} can be written to a few, corresponding group matching symbol $4* /

span> copyright Notice

TDX

Source: Blog Park TDX Technical blog--http://www.cnblogs.com/tandaxia

Your support is the greatest encouragement to bloggers, thank you for your earnest reading.

This article is copyrighted by the author and the blog Park, welcome, but without the consent of the author must retain the statement, and in the article page obvious location to the original link, otherwise reserves the right to hold legal responsibility.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.