javascript - Web微信聊天輸入框解決方案
問題描述
問題解答
回答1:<!--input.wxml--><view class='section'><inputplaceholder='這是一個(gè)可以自動(dòng)聚焦的input'auto-focus/></view><view class='section'><inputplaceholder='這個(gè)只有在按鈕點(diǎn)擊的時(shí)候才聚焦' focus='{{focus}}' /><viewclass='btn-area'><buttonbindtap='bindButtonTap'>使得輸入框獲取焦點(diǎn)</button></view></view><view class='section'><input maxlength='10' placeholder='最大輸入長(zhǎng)度10' /></view><view class='section'><viewclass='section__title'>你輸入的是:{{inputValue}}</view><input bindinput='bindKeyInput' placeholder='輸入同步到view中'/></view><view class='section'><input bindinput='bindReplaceInput' placeholder='連續(xù)的兩個(gè)1會(huì)變成2' /></view><view class='section'><input bindinput='bindHideKeyboard' placeholder='輸入123自動(dòng)收起鍵盤' /></view><view class='section'><inputtype='emoji' placeholder='這是一個(gè)帶有表情的輸入框' /></view><view class='section'><inputpassword type='number' /></view><view class='section'><inputpassword type='text' /></view><view class='section'><inputtype='digit' placeholder='帶小數(shù)點(diǎn)的數(shù)字鍵盤'/></view><view class='section'><inputtype='idcard' placeholder='身份證輸入鍵盤' /></view><view class='section'><inputplaceholder- placeholder='占位符字體是紅色的' /></view>//input.jsPage({data:{focus:false,inputValue:''},bindButtonTap:function(){this.setData({focus:Date.now()})},bindKeyInput:function(e){this.setData({inputValue:e.detail.value})},bindReplaceInput:function(e){varvalue = e.detail.value;var pos= e.detail.cursor;if(pos!= -1){//光標(biāo)在中間varleft = e.detail.value.slice(0,pos);//計(jì)算光標(biāo)的位置pos =left.replace(/11/g,’2’).length;}
//直接返回對(duì)象,可以對(duì)輸入進(jìn)行過濾處理,同時(shí)可以控制光標(biāo)的位置return {value:value.replace(/11/g,’2’),cursor:pos}
//或者直接返回字符串,光標(biāo)在最后邊//return value.replace(/11/g,’2’),},bindHideKeyboard:function(e){if(e.detail.value=== '123'){//收起鍵盤wx.hideKeyboard();}}})
相關(guān)文章:
1. 如何解決docker宿主機(jī)無法訪問容器中的服務(wù)?2. 前端 - CSS3 box-shadow如何設(shè)置,或者用什么方法可以產(chǎn)生圖中這樣陰影的效果。3. node.js - vue-cll+sass 樣式不出來 已經(jīng)npm install sass、 sass-loader了4. html - css 如何讓文字標(biāo)題顯示在邊框上?5. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣?這個(gè)是怎么回事????6. 在應(yīng)用配置文件 app.php 中找不到’route_check_cache’配置項(xiàng)7. html按鍵開關(guān)如何提交我想需要的值到數(shù)據(jù)庫(kù)8. vim中編輯HTML文件時(shí)換行不能縮進(jìn)9. HTML5中怎么判斷用戶是否正在瀏覽頁(yè)面?10. html - 微信端video標(biāo)簽播放mp4視頻,安卓端提示視頻解析錯(cuò)誤
