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. javascript - sublime快鍵鍵問題2. 實現bing搜索工具urlAPI提交3. boot2docker無法啟動4. javascript - 移動端上不能實現拖拽布局嗎?5. javascript - 如何判斷不同兩個對象觸發同一事件?6. 前端 - 這段代碼一直生效不了,查半天因為 top: 0px; 分號后一個隱藏的東西,也不是占位符...刪了就可以生效,這是什么情況。。7. nginx bind failed8. thinkPHP5中獲取數據庫數據后默認選中下拉框的值,傳遞到后臺消失不見。有圖有代碼,希望有人幫忙9. angular.js - 單頁應用(ng/vue)該如何監聽用戶離開當前頁面(或者路由)?10. javascript - react native在run-android時出現這個錯誤該怎么解決?大神賜教

網公網安備