微信小程序 textarea 组件详解及简单实例
更新时间：2017年01月10日 15:08:48 投稿：lqh
这篇文章主要介绍了微信小程序 textarea 组件详解及简单实例的相关资料,需要的朋友可以参考下
微信小程序textarea
相关文章：
多行输入框。
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| value | String | 输入框的内容 | |
| placeholder | String | 输入框为空时占位符 | |
| placeholder-style | String | 指定 placeholder 的样式 | |
| placeholder-class | String | textarea-placeholder | 指定 placeholder 的样式类 |
| disabled | Boolean | false | 是否禁用 |
| maxlength | Number | 140 | 最大输入长度，设置为0的时候不限制最大长度 |
| auto-focus | Boolean | false | 自动聚焦，拉起键盘。页面中只能有一个 <textarea/> 或<input/> 设置 auto-focus 属性 |
| focus | Boolean | false | 获取焦点（开发工具暂不支持） |
| auto-height | Boolean | false | 是否自动增高，设置auto-height时，style.height不生效 |
| bindfocus | EventHandle | 输入框聚焦时触发，event.detail = {value: value} | |
| bindblur | EventHandle | 输入框失去焦点时触发，event.detail = {value: value} | |
| bindlinechange | EventHandle | 输入框行数变化时调用，event.detail = {height: 0, heightRpx: 0, lineCount: 0} |
示例代码：
<!--textarea.wxml-->
<view class="section">
<textarea bindblur="bindTextAreaBlur" auto-height placeholder="自动变高" />
</view>
<view class="section">
<textarea placeholder="placeholder颜色是红色的" placeholder-style="color:red;" />
</view>
<view class="section">
<textarea placeholder="这是一个可以自动聚焦的textarea" auto-focus />
</view>
<view class="section">
<textarea placeholder="这个只有在按钮点击的时候才聚焦" focus="{{focus}}" />
<view class="btn-area">
<button bindtap="bindButtonTap">使得输入框获取焦点</button>
</view>
</view>
//textarea.js
Page({
data: {
height: 20,
focus: false
},
bindButtonTap: function() {
this.setData({
focus: true
})
},
bindTextAreaBlur: function(e) {
console.log(e.detail.value)
}
})
Bug & Tipbug: 微信版本 6.3.30，textarea 在列表渲染时，新增加的 textarea 在自动聚焦时的位置计算错误tip: 请勿在 scroll-view 中使用 textarea 组件
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
相关文章
这篇文章主要为大家介绍了response body加密如何破解的方法示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
这篇文章小编主要给大家介绍是8个工程中必须必备的JavaScript代码片段,需要的小伙伴可以参考下面文章的具体内容，对你有用的话建议收藏哦2021-09-09
这篇文章主要介绍了用javascript制作qq注册动态页面,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友可以参考下2021-04-04
这篇文章主要介绍了JS构造函数和实例化的关系及原型引入，下文围绕JS构造函数和实例化的关系及原型引入的西安海关资料展开全文内容,需要的朋友可以参考一下，希望对大家有所帮助2021-11-11
这篇文章主要介绍了微信小程序 toast 详解及实例代码的相关资料,需要的朋友可以参考下2016-11-11
微信小程序Server端环境配置详解（SSL， Nginx HTTPS，TLS 1.2 升级）
这篇文章主要介绍了微信小程序Server端环境配置详解（SSL， Nginx HTTPS，TLS 1.2 升级）的相关资料,需要的朋友可以参考下2017-01-01
这篇文章主要介绍了微信小程序 开发经验整理的相关资料,需要的朋友可以参考下2017-02-02
这篇文章主要为大家介绍了webpack的安装配置及使用的教程示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-06-06
本文是对微信支付 JS API支付接口介绍,并附代码实例,在开发过程中具有参考价值,希望能帮助到需要的朋友2016-07-07
这篇文章主要为大家介绍了ECharts图表使用及异步加载的特性详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-12-12
最新评论