textarea高度自适应,随着内容增加高度增加
$(function(){
$.fn.autoHeight = function(){
function autoHeight(elem){
elem.style.height = 'auto';
elem.scrollTop = 0; //防抖动
elem.style.height = elem.scrollHeight + 'px';
}
this.each(function(){
autoHeight(this);
$(this).on('keyup', function(){
autoHeight(this);
});
});
}
$('textarea[autoHeight]').autoHeight();
})
页面中的textarea直接加属性就行
<textarea autoHeight="true" readonly="readonly" > </textarea>
pc 移动端都经过测试,没问题 放心用吧!
textarea高度自适应,随着内容增加高度增加的更多相关文章
- Header 与 Footer 的 DIV 高度固定, 中间内容 DIV高度自适应,内容不满一页时,默认填满屏幕。
一.需求: 页面布局分三大块: Header Body Footer 1.内容不满一页时,Footer 在屏幕最底部,Body 填充满 Header 与 Footer 中间的部分. 2.当缩小浏览器时 ...
- css3实现左右div高度自适应且内容居中对齐
主要运用了css3的弹层布局,直接上代码: 效果:左边盒子宽度固定.内容居中对齐.与右侧盒子高度相等,右侧自动缩放 html: <div class="main"> & ...
- 设置DIV最小高度以及高度自适应随着内容的变化而变化
<!--退租账单--> <div id="bilsli" onmouseover="showBill(this)"> #bilsli{ ...
- Iframe 高度自适应,js控制Iframe 高度自适应
Iframe 高度自适应, js控制Iframe 高度自适应, iframe自适应高度 ================================ ©Copyright 蕃薯耀 2019年12 ...
- iOS开发之多种Cell高度自适应实现方案的UI流畅度分析
本篇博客的主题是关于UI操作流畅度优化的一篇博客,我们以TableView中填充多个根据内容自适应高度的Cell来作为本篇博客的使用场景.当然Cell高度的自适应网上的解决方案是铺天盖地呢,今天我们的 ...
- UITableViewCell高度自适应探索--AutoLayout结合Frame
UITableViewCell高度自适应探索--UITableView+FDTemplateLayoutCell地址: http://www.jianshu.com/p/7839e3a273a6UIT ...
- 转:iOS开发之多种Cell高度自适应实现方案的UI流畅度分析
本篇博客的主题是关于UI操作流畅度优化的一篇博客,我们以TableView中填充多个根据内容自适应高度的Cell来作为本篇博客的使用场景.当然Cell高度的自适应网上的解决方案是铺天盖地呢,今天我们的 ...
- flex布局嵌套之高度自适应
查遍各大资源无任何flex嵌套布局的例子,经过自己折腾完成了项目中的高度自适应需求(更多应用于前端组件) 效果图: html代码:(关键地方已经用颜色特别标识 ^_^) <!DOCTYPE ht ...
- DIV高度自适应及注意问题(转)
本文和大家重点讨论一下DIV高度自适应及注意问题,主要包括父div高度随子div的高度改变而改变和子div高度随父亲div高度改变而改变两种情况. DIV高度自适应及注意问题 积累了一些经验,总结出一 ...
- CSS float 父元素高度自适应
<html> <head><title></title><style type="text/css">*{margin: ...
随机推荐
- 2016-2017 ACM-ICPC, Asia Tsukuba Regional Contest D Hidden Anagrams
题目链接:http://codeforces.com/gym/101158/attachments /* * @Author: lyucheng * @Date: 2017-10-21 12:20:0 ...
- 网络拓展知识 ACL NAT IPv6
第1章 ACL 访问控制列表 访问控制表(”位代表精确匹配,而“1“位代表不许匹配. 例如路由器EIGRP的配置中: RouterA(config)#router eigrp 100 RouterA( ...
- Python中编码问题:u'\xe6\x97\xa0\xe5\x90\x8d' 类型的转为utf-8的解决办法
相信小伙伴们遇到过类似这样的问题,python2中各种头疼的转码,类似u'\xe6\x97\xa0\xe5\x90\x8d' 的编码,直接s.decode()是无法解决编码问题.尝试了无数办法,都无法 ...
- 原生addClass 方法 添加类函数
function addClass(id,new_class){ var i,n=0; new_class=new_class.split(","); ...
- HTML知识速递
1.html的定义 超文本标记语言(Hypertext Markup Language,HTML)通过标签语言来标记要显示的网页中的各个部分.一套规则,浏览器认识的规则 浏览器按顺序渲染网页文件,然后 ...
- Android 工程师
转发:https://zhuanlan.zhihu.com/p/30429725 这句话我真的憋了好久.Android 工程师只要关注我,我就能让你达到大师级水平,不是面试时的吹牛逼水平,不是自我欺骗 ...
- ARM开发板链接shell
1.用网线插入开发板(最好链接路由器) 2.启动开发板(可以用U盘启动) 执行 #run bootusb 3.联网 #ifconfig eth0 up #udhcpc或者#dhclient wan # ...
- 浅谈Android中的组播(多播)
组播使用UDP对一定范围内的地址发送相同的一组Packet,即一次可以向多个接受者发出信息,其与单播的主要区别是地址的形式.IP协议分配了一定范围的地址空间给多播(多播只能使用这个范围内的IP),IP ...
- [转载] 谷歌技术"三宝"之谷歌文件系统
转载自http://blog.csdn.net/opennaive/article/details/7483523 题记:初学分布式文件系统,写篇博客加深点印象.GFS的特点是使用一堆廉价的商用计算机 ...
- 学会WCF之试错法——安全配置报错分析
安全配置报错分析 服务端配置 <system.serviceModel> <bindings> <wsHttpBinding> <binding name = ...