微信小程序输入框input-创新互联

微信小程序输入框input

属性名 类型 默认值 说明

value String 输入框的内容

type String text input的类型，有效值：text,number,idcard,digit,time,date

password Boolean false 是否是密码类型

placeholder String 输入框为空时占位符

placeholder-style String 指定placeholder的样式

placeholder-class String input-placeholder 指定placeholder的样式类

disabled Boolean false 是否禁用

maxlength Number 140 大输入长度，设置为0的时候不限制大长度

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

focus Boolean false 使得input获取焦点

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

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

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

bindblur EventHandle 输入框失去焦点时触发，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();

  }

 }

})

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。