小编给大家分享一下微信小程序中input输入框组件有什么用，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
成都创新互联公司拥有10余年成都网站建设工作经验,为各大企业提供成都网站设计、做网站服务，对于网页设计、PC网站建设（电脑版网站建设）、
App定制开发、wap网站建设（手机版网站建设）、程序开发、网站优化（SEO优化）、微网站、
主机域名等，凭借多年来在互联网的打拼，我们在互联网网站建设行业积累了很多网站制作、网站设计、网络营销经验，集策划、开发、设计、营销、管理等网站化运作于一体，具备承接各种规模类型的网站建设项目的能力。
input输入框组件说明:
input输入框示例代码运行效果如下：
下面是WXML代码：
[XML]
type：有效值：text 感觉没什么区别
password：
placeholder：
disable:
较大长度：
下面是WXSS代码：
[JavaScript]
.content{
border:1px black solid;
margin: 10px;
font-size: 10pt;
padding: 5px;
}
input{
border:1px red solid;
margin: 5px;
}下面是WXML代码：
[XML]
bindinput="当内容改变"
bindfocus:当获取焦点
bindblur：当失去焦点触发
内容：
{{log}}
下面是JS代码：
[JavaScript]
Page({
data:{
log:'事件触发'
},
bindblur:function(e){
var value=e.detail.value;
this.setData({
log:"bindblur失去焦点.输入框值="+value
})
},
bindinput:function(e){
var value=e.detail.value;
this.setData({
log:"bindinput内容改变.输入框值="+value
})
},
bindfocus:function(e){
var value=e.detail.value;
this.setData({
log:"bindfocus获取焦点.输入框值="+value
})
}
})下面是WXSS代码：
[JavaScript]
.content{
border:1px black solid;
margin: 10px;
font-size: 10pt;
padding: 5px;
}
input{
border:1px red solid;
margin: 5px;
}组件属性：
属性 | 描述 | 类型 | 默认值 |
value | 输入框的初始内容 | String |
|
type | 有效值：text, number, idcard, digit | String | text |
password | 是否是密码类型 | Boolean | false |
placeholder | 输入框为空时占位符 | String |
|
placeholder-style | 指定 placeholder 的样式 | String |
|
placeholder-class | 指定 placeholder 的样式类 | String | input-placeholder |
disabled | 是否禁用 | Boolean | false |
maxlength | 较大输入长度， 设置为-1 的时候不限制较大长度 | Number | 140 |
auto-focus | 自动聚焦，拉起键盘。页面中只能有一个 input 或 textarea标签时， 设置 auto-focus 属性 | Boolean | false |
focus | 获取焦点（当前开发工具暂不支持） | Boolean | false |
bindinput | 除了date/time类型外的输入框，当键盘输入时，触发input事件，处理函数可以直接 return 一个字符串，将替换输入框的内容。 | EventHandle |
|
bindfocus | 输入框聚焦时触发event.detail = {value: value} | EventHandle |
|
bindblur | 输入框失去焦点时触发event.detail = {value: value} | EventHandle |
|
属性解析：
下面是WXML代码：
[XML]
等同于
等同于
等同于
等同于
等同于
以上是“微信小程序中input输入框组件有什么用”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！
标题名称：微信小程序中input输入框组件有什么用-创新互联
转载来于：
http://cdkjz.cn/article/ipghi.html
