javascript - Web微信聊天輸入框解決方案
問題描述
問題解答
回答1:<!--input.wxml--><view class='section'><inputplaceholder='這是一個可以自動聚焦的input'auto-focus/></view><view class='section'><inputplaceholder='這個只有在按鈕點擊的時候才聚焦' focus='{{focus}}' /><viewclass='btn-area'><buttonbindtap='bindButtonTap'>使得輸入框獲取焦點</button></view></view><view class='section'><input maxlength='10' placeholder='最大輸入長度10' /></view><view class='section'><viewclass='section__title'>你輸入的是:{{inputValue}}</view><input bindinput='bindKeyInput' placeholder='輸入同步到view中'/></view><view class='section'><input bindinput='bindReplaceInput' placeholder='連續的兩個1會變成2' /></view><view class='section'><input bindinput='bindHideKeyboard' placeholder='輸入123自動收起鍵盤' /></view><view class='section'><inputtype='emoji' placeholder='這是一個帶有表情的輸入框' /></view><view class='section'><inputpassword type='number' /></view><view class='section'><inputpassword type='text' /></view><view class='section'><inputtype='digit' placeholder='帶小數點的數字鍵盤'/></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){//光標在中間varleft = e.detail.value.slice(0,pos);//計算光標的位置pos =left.replace(/11/g,’2’).length;}
//直接返回對象,可以對輸入進行過濾處理,同時可以控制光標的位置return {value:value.replace(/11/g,’2’),cursor:pos}
//或者直接返回字符串,光標在最后邊//return value.replace(/11/g,’2’),},bindHideKeyboard:function(e){if(e.detail.value=== '123'){//收起鍵盤wx.hideKeyboard();}}})
相關文章:
1. html5 - 前端面試碰到了一個緩存數據的問題,來論壇上請教一下2. macos - 無法source activate python273. java - butterknife怎么綁定多個view4. java - 同步/異步與阻塞/非阻塞之間的差異具體是什么?5. javascript - 打算寫一個c++的node圖像處理模塊,有沒有推薦的c++圖片處理庫?6. css3 讓圖片變成灰色(filter),但針對IE11瀏覽器無效7. android - Genymotion 模擬器可以做屏幕適配檢測嗎?8. html - vue里面:src在IE(9-11)下不顯示圖片9. 運行python程序時出現“應用程序發生異常”的內存錯誤?10. html5 - 在HBuilder中打包Android的apk包出錯,不知道是什么原因。

網公網安備