小程序中里的bindinput_微信小程序输入框input

微信小程序输入框input

属性名类型默认值说明

valueString 输入框的内容

typeStringtextinput的类型，有效值：text,number,idcard,digit,time,date

passwordBooleanfalse是否是密码类型

placeholderString 输入框为空时占位符

placeholder-styleString 指定placeholder的样式

placeholder-classStringinput-placeholder指定placeholder的样式类

disabledBooleanfalse是否禁用

maxlengthNumber140最大输入长度，设置为0的时候不限制最大长度

auto-focusBooleanfalse自动聚焦，拉起键盘。页面中只能有一个input设置auto-focus属性

focusBooleanfalse使得input获取焦点

bindchangeEventHandle 输入框失去焦点时，触发bindchange事件，event.detail={value:value}

bindinputEventHandle 除了date/time类型外的输入框，当键盘输入时，触发input事件，event.detail={value:value}，处理函数可以直接return一个字符串，将替换输入框的内容。

bindfocusEventHandle 输入框聚焦时触发，event.detail = {value:value}

bindblurEventHandle 输入框失去焦点时触发，event.detail = {value:value}

使得输入框获取焦点

你输入的是：`inputValue`

//input.js

Page({

data:{

focus:false,

inputValue:""

bindButtonTap:function(){

this.setData({

focus:Date.now()

})

bindKeyInput:function(e){

this.setData({

inputValue:e.detail.value

})

bindReplaceInput:function(e){

var value = e.detail.value;

var pos = e.detail.cursor;

if(pos != -1){

//光标在中间

var left = 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();

}

})

小程序中里的bindinput_微信小程序输入框input相关推荐

微信小程序中嵌套html_在微信小程序中渲染HTML内容3种解决方案及分析与问题解决...
大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题.但是,在微信小程序(下文简称为「小程序」)中,应当如何渲染这部分内容呢? 在微信小程序中渲 ...
小程序中里的bindinput_云开发实战分享|诗和远方：旅行小账本云开发
原创:豪豪前言最近沉迷小程序开发,发现了一款功能.界面.体验俱佳的小程序"旅行小账本".着手做了个简约版--"旅行小账本".效果比较满意,毕竟前后台一人单干 ...
微信小程序中嵌套html_在微信小程序中渲染HTML内容的方法示例
大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题.但是,在微信小程序(下文简称为「小程序」)中,应当如何渲染这部分内容呢? 解决方案 wxP ...
小程序中ajax返回数据,微信小程序调用接口返回数据或提交数据
/*习惯用ajax了,则把(wx.request)封装一下, 调用方式 1.先引入:const http = require('../../js/http.js') 2.使用方式:http.post或 ...
微信小程序开发系列五：微信小程序中如何响应用户输入事件
微信小程序开发系列教程微信小程序开发系列一:微信小程序的申请和开发环境的搭建微信小程序开发系列二:微信小程序的视图设计微信小程序开发系列三:微信小程序的调试方法微信小程序开发系列四:微信小程序 ...
uniapp 微信小程序最近写的两个小程序中都会有，微信分享的设置，每次都在单个页面中写相同的内容，修改很不友好。下面全局分享代码做了记录
最近写的两个小程序中都会有,微信分享的设置,每次都在单个页面中写相同的内容,修改很不友好.下面全局分享代码做了割记录首先在小程序中配置微信分享,和微信朋友圈, onShareAppMessage, ...
我是如何拿到HTTPS中的加密数据（微信小程序同样适用）
我是如何拿到HTTPS中的加密数据(微信小程序同样适用) HTTPS很安全,只要用户不作声明特别声明引子网络上的坑以及我怎么解决的总结重申下解决方法备注下载fiddler的官网: 下载 ...
微信小程序js数组初始化_微信小程序开发之改变data中数组或对象的某一属性值...
前言:在小程序的开发中,我们在view中便利data中数组或对象时,很多情况下需要在js中动态改变数组或者对象中某一香的属性值. 效果图: 我给大家总结了案例如下: wxml如下: {{item.we ...
微信小程序开发系列七：微信小程序的页面跳转
微信小程序开发系列教程微信小程序开发系列一:微信小程序的申请和开发环境的搭建微信小程序开发系列二:微信小程序的视图设计微信小程序开发系列三:微信小程序的调试方法微信小程序开发系列四:微信小程序 ...

小程序中里的bindinput_微信小程序输入框input

小程序中里的bindinput_微信小程序输入框input相关推荐

最新文章

热门文章