您现在的位置:首页 >> 前端 >> 内容

im聊天输入框高度问题(解决)

时间:2018/2/6 13:59:14 点击:

  核心提示:im 聊天输入框高度问题问题描述输入框的高度随着字数增多而增高,但是超过一定高度后,不会增高,场景像微信的输入框一样;刚开始使用 autosize.js 控制 textarea ,但是在 ios11 ...

im 聊天输入框高度问题

问题描述

输入框的高度随着字数增多而增高,但是超过一定高度后,不会增高,场景像微信的输入框一样;刚开始使用 autosize.js 控制 textarea ,但是在 ios11 有兼容问题,不断触发聚焦事件;

解决方案

舍弃 autosize.js ,用纯css + html 实现:

与textarea放一个平级的 pre 标签与 textarea 双向绑定;textarea 高度设置百分之百;textarea 父级的父级设置一个最大高度;父级不限制,然后textarea字数增加;pre标签也跟着增高,把父级撑开;textarea高度也就跟着父级变化;

Tags:IM M聊 聊天 天输 
作者:网络 来源:FE-阿阳的博客