摘要:下面我主要使用了小程序標(biāo)簽的方法對(duì)輸入的值進(jìn)行監(jiān)聽(tīng),然后進(jìn)行正則匹配。標(biāo)簽微信小程序標(biāo)簽自帶屬性,可以調(diào)起帶有小數(shù)點(diǎn)的數(shù)字鍵盤(pán),屬性可以控制我們輸入字符的個(gè)數(shù),然后我們給標(biāo)簽綁定方法。
開(kāi)篇廢話
在開(kāi)發(fā)過(guò)程中經(jīng)常遇到這樣的需求:用戶只能輸入數(shù)字并且只保留小數(shù)點(diǎn)兩位。雖然我們可以在提交表單的時(shí)候進(jìn)行驗(yàn)證,但是體驗(yàn)不是很好。下面我主要使用了小程序input標(biāo)簽的bindinput方法對(duì)輸入的值進(jìn)行監(jiān)聽(tīng),然后進(jìn)行正則匹配。1. input標(biāo)簽
微信小程序input標(biāo)簽自帶type=digit屬性,可以調(diào)起帶有小數(shù)點(diǎn)的數(shù)字鍵盤(pán),maxlength屬性可以控制我們輸入字符的個(gè)數(shù),然后我們給input標(biāo)簽綁定bindinput方法。
2. 綁定監(jiān)聽(tīng)事件
bindinput方法可以監(jiān)聽(tīng)到當(dāng)前輸入框的值,類似于onchange事件,但不太一樣。通過(guò)e.detail.value可以獲取到input的值,return返回的字符串可以替換掉輸入的字符串。
3. 正則匹配匹配正則通過(guò)則返回所有字符,不通過(guò)則去掉最后一個(gè)不匹配的字符返回。
/*正則匹配*/ regInput(e){ if(/^(d?)+(.d{0,2})?$/.test(e.detail.value)){ return e.detail.value; }else { return e.detail.value.substring(0,e.detail.value.length-1); } }結(jié)束
這個(gè)正則表達(dá)式不是很完美,歡迎一起來(lái)優(yōu)化。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/108298.html
摘要:下面我主要使用了小程序標(biāo)簽的方法對(duì)輸入的值進(jìn)行監(jiān)聽(tīng),然后進(jìn)行正則匹配。標(biāo)簽微信小程序標(biāo)簽自帶屬性,可以調(diào)起帶有小數(shù)點(diǎn)的數(shù)字鍵盤(pán),屬性可以控制我們輸入字符的個(gè)數(shù),然后我們給標(biāo)簽綁定方法。 開(kāi)篇廢話 在開(kāi)發(fā)過(guò)程中經(jīng)常遇到這樣的需求:用戶只能輸入數(shù)字并且只保留小數(shù)點(diǎn)兩位。雖然我們可以在提交表單的時(shí)候進(jìn)行驗(yàn)證,但是體驗(yàn)不是很好。下面我主要使用了小程序input標(biāo)簽的bindinput方法對(duì)輸入...
摘要:下面我主要使用了小程序標(biāo)簽的方法對(duì)輸入的值進(jìn)行監(jiān)聽(tīng),然后進(jìn)行正則匹配。標(biāo)簽微信小程序標(biāo)簽自帶屬性,可以調(diào)起帶有小數(shù)點(diǎn)的數(shù)字鍵盤(pán),屬性可以控制我們輸入字符的個(gè)數(shù),然后我們給標(biāo)簽綁定方法。 開(kāi)篇廢話 在開(kāi)發(fā)過(guò)程中經(jīng)常遇到這樣的需求:用戶只能輸入數(shù)字并且只保留小數(shù)點(diǎn)兩位。雖然我們可以在提交表單的時(shí)候進(jìn)行驗(yàn)證,但是體驗(yàn)不是很好。下面我主要使用了小程序input標(biāo)簽的bindinput方法對(duì)輸入...
摘要:最近微信小程序異?;鸨芏嗳嗽趯W(xué)習(xí),下面帶著大家搭建下微信小程序的調(diào)試環(huán)境,并調(diào)試入門(mén)練手項(xiàng)目通訊錄和基礎(chǔ)即可微信推薦使用的語(yǔ)言,去菜鳥(niǎo)教程簡(jiǎn)單學(xué)習(xí)下,,,即可,方便大家學(xué)習(xí)。 一、前言(坑爹的玩意) 項(xiàng)目源碼:https://github.com/saucxs/wx_... 微信小程序自從2017年,被各種看好,不過(guò)一段時(shí)間過(guò)去了還是反響平平,下半年隨著各項(xiàng)功能的開(kāi)放,很多企業(yè)...
摘要:準(zhǔn)備工作開(kāi)發(fā)工具下載地址竟然隱藏在一個(gè)超鏈接里,真的很不醒目啊文檔地址初次體驗(yàn)新建項(xiàng)目的時(shí)候,可以選擇是小程序小游戲,這次我體驗(yàn)的是小程序的開(kāi)發(fā)??梢耘渲眯〕绦蜻吔绲?,如頂部的導(dǎo)航欄的一些樣式。 很早前就想體驗(yàn)一把小程序的開(kāi)發(fā)了,如果熟悉三大框架的話,小程序的開(kāi)發(fā)還是很容易上手的,所以只要跟著做一個(gè)小應(yīng)用,加上官方的文檔就十分好學(xué)了。加上官方提供的開(kāi)發(fā)工具也比較簡(jiǎn)潔好用,初次體驗(yàn)的我覺(jué)...
閱讀 977·2021-11-24 09:39
閱讀 3408·2021-10-27 14:20
閱讀 2334·2019-08-30 14:08
閱讀 3372·2019-08-29 16:34
閱讀 2188·2019-08-26 12:14
閱讀 2115·2019-08-26 11:54
閱讀 2784·2019-08-26 11:44
閱讀 2487·2019-08-26 11:38