$(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高度自适应,随着内容增加高度增加的更多相关文章

  1. Header 与 Footer 的 DIV 高度固定, 中间内容 DIV高度自适应,内容不满一页时,默认填满屏幕。

    一.需求: 页面布局分三大块: Header Body Footer 1.内容不满一页时,Footer 在屏幕最底部,Body 填充满 Header 与 Footer 中间的部分. 2.当缩小浏览器时 ...

  2. css3实现左右div高度自适应且内容居中对齐

    主要运用了css3的弹层布局,直接上代码: 效果:左边盒子宽度固定.内容居中对齐.与右侧盒子高度相等,右侧自动缩放 html: <div class="main"> & ...

  3. 设置DIV最小高度以及高度自适应随着内容的变化而变化

    <!--退租账单--> <div id="bilsli" onmouseover="showBill(this)"> #bilsli{ ...

  4. Iframe 高度自适应,js控制Iframe 高度自适应

     Iframe 高度自适应, js控制Iframe 高度自适应, iframe自适应高度 ================================ ©Copyright 蕃薯耀 2019年12 ...

  5. iOS开发之多种Cell高度自适应实现方案的UI流畅度分析

    本篇博客的主题是关于UI操作流畅度优化的一篇博客,我们以TableView中填充多个根据内容自适应高度的Cell来作为本篇博客的使用场景.当然Cell高度的自适应网上的解决方案是铺天盖地呢,今天我们的 ...

  6. UITableViewCell高度自适应探索--AutoLayout结合Frame

    UITableViewCell高度自适应探索--UITableView+FDTemplateLayoutCell地址: http://www.jianshu.com/p/7839e3a273a6UIT ...

  7. 转:iOS开发之多种Cell高度自适应实现方案的UI流畅度分析

    本篇博客的主题是关于UI操作流畅度优化的一篇博客,我们以TableView中填充多个根据内容自适应高度的Cell来作为本篇博客的使用场景.当然Cell高度的自适应网上的解决方案是铺天盖地呢,今天我们的 ...

  8. flex布局嵌套之高度自适应

    查遍各大资源无任何flex嵌套布局的例子,经过自己折腾完成了项目中的高度自适应需求(更多应用于前端组件) 效果图: html代码:(关键地方已经用颜色特别标识 ^_^) <!DOCTYPE ht ...

  9. DIV高度自适应及注意问题(转)

    本文和大家重点讨论一下DIV高度自适应及注意问题,主要包括父div高度随子div的高度改变而改变和子div高度随父亲div高度改变而改变两种情况. DIV高度自适应及注意问题 积累了一些经验,总结出一 ...

  10. CSS float 父元素高度自适应

    <html> <head><title></title><style type="text/css">*{margin: ...

随机推荐

  1. hdu 2196 Computer(树形DP经典)

    Computer Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  2. 网络基础一 交换机 路由器 OSI7层模型

    第1章 网络基础 1.1 网络的出现 解决计算机通讯的需求 实现计算机信息可以传递 1.2 主机之间实现通讯基本要求(三要素) ①. 需要在两台主机之间建立物理连接,物理连接的方式有网线 光纤线 wi ...

  3. javascript 可多选的下拉框 multiselect

    首先引用一个写的很好的博客http://www.cnblogs.com/landeanfen/p/5013452.html 我使用的是bootstrap-multiselect,实现功能是 选择下拉框 ...

  4. 通用的contain函数

    用来检测节点所属关系:document.documentElement.contains(document.body) function contains(refNode, otherNode) {i ...

  5. Postman参数化使用以及中文乱码问题解决

    1.参数化详解 准备工作,数据准备 2.使用csv文件时中文乱码可以通过使用txt文本,json文本改变调用json文件改变文件的编码格式解决 3:参数化数据调用的两种方式通过调用读取文件传入环境变量 ...

  6. css 选择器和优先级

    css样式是做网页时,页面 布局不可或缺的关键点.但是在做网页时,会遇到一些明明已经设置了样式的元素,缺无法达到想要的效果,这种情况比较常见.这就涉及到优先级的问题了 要说到css的优先级,先来看下c ...

  7. js 根据身份证号获取性别,年龄,等

    $(function(){        $("#corpOwnerIdno").blur(function(){          //获取输入身份证号码             ...

  8. SpringMVC接收复杂对象

    SpringMVC接收复杂对象 转载请注明地址:http://www.cnblogs.com/funnyzpc/p/7642977.html 本节内容暂放一边,我先扯点儿,心情好了,代码顺风顺水哈~ ...

  9. 基于Visual Studio 2010 阐述C#4个特性

    Csharp4.0与以往版本基础体现了强大的性能优势,主要体现在以下四个方面: 1. 通过委托成员来实现接口 在C# 4.0中可以通过委托来实现某个成员的接口,例如下面的代码: public clas ...

  10. Unity跨平台C/CPP动态库编译---可靠UDP网络库kcp基于CMake的各平台构建实践

    1.为什么需要动态库 a)提供原生代码(native code)的支持,也叫原生插件,但是我实践的是c/cpp跨平台动态库,这里不具体涉及安卓平台java库和ios平台的objectc库构建. b)某 ...