原文链接

方法一(jquery):

$('textarea').each(function () {
  this.setAttribute('style', 'height:' + (this.scrollHeight) + 'px;overflow-y:hidden;');
}).on('input', function () {
  this.style.height = 'auto';
  this.style.height = (this.scrollHeight) + 'px';
});

方法二:

function setHeight(element) {
  $(element).css({'height':'auto','overflow-y':'hidden'}).height(element.scrollHeight);
}
$('textarea').each(function () {
  setHeight(this);
}).on('input', function () {
  setHeight(this);
});

textarea输入框随内容撑开高度的更多相关文章

  1. Jquery实现textarea根据文本内容自适应高度

    本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...

  2. 文本框textarea根据输入内容自适应高度 和输入中文和数字换行解决方法

    textarea内容可从后台读取或手动输入,常规输入后中文和数字会出现换行问题 <style> #textarea { display: block; margin: 0 auto; ov ...

  3. textarea文本域轻松实现高度自适应

    转载:http://www.xuanfengge.com/textarea-on-how-to-achieve-a-high-degree-of-adaptive.html 今天需要些一个回复评论的页 ...

  4. html5 textarea 文本框根据输入内容自适应高度

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. div模拟textarea文本域轻松实现高度自适应——张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...

  6. UIWebView中加载HTML的Table,td设置百分比宽度并且宽度不被里面的内容撑开

    正常情况下,iOS使用WebView加载HTML的Table时,为了让Table适应屏幕宽度,会使用百分比设置td的宽度,但是由于td中的内容过多,td会被撑开,导致整个Table的宽度会变宽,超出屏 ...

  7. textarea输入框限制字数(JS)

    第一种: <textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span ...

  8. 设置DIV根据内容自动调整高度的三个方法

    Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid=&qu ...

  9. 工作记录(JS向textarea添加固定内容、通过固定字符将字符串分割为数组)

    第一个是在 textarea 输入框中添加固定的内容. 代码如下: <textarea id="text" cols="30" rows="10 ...

随机推荐

  1. 使用TestNG 和 CSV文件进行数据驱动

    package testNGPractice; import java.io.BufferedReader; import java.io.FileInputStream; import java.i ...

  2. Java List部分截取,获得指定长度子集合

    subList方法用于获取列表中指定范围的子列表,该列表支持原列表所支持的所有可选操作.返回列表中指定范围的子列表. 语法 subList(int fromIndex, int toIndex) fr ...

  3. 获取网站图标Icon

    通常情况下,做网站的都会给自己的网站添加一个Icon,浏览器上一长排的标签页,用Icon来区分就显得更加醒目.现在想找一个没有Icon的网站并不好找,可见没有Icon的网站是多么的业余啊." ...

  4. [BZOJ3166][Heoi2013]Alo 可持久化Trie树

    3166: [Heoi2013]Alo Time Limit: 20 Sec Memory Limit: 256 MB DescriptionWelcome to ALO ( Arithmetic a ...

  5. js复选框插件

    <div class="selectList selectQgClass" id="selectQgClass"> <div class=&q ...

  6. bzoj3251: 树上三角形(思维题)

    神tmWA了8发调了20min才发现输出没回车T T... 首先考虑一段什么样的序列才会是N... 显然最长的形式就是斐波那契,前两数之和等于第三数之和,这样就无法组成三角形并且序列最长.可以发现在i ...

  7. 解题:APIO 2008 免费道路

    题面 我们发现我们可以很容易知道最终完成的生成树中有多少鹅卵石路,但是我们不好得到这棵生成树的结构,所以我们尽量“谨慎”地完成生成树·,最好是一点点加到我们要达到的标准而不是通过删掉一些东西来完成 我 ...

  8. 中南多校对抗赛 第三场 B

    B:Arithmetic Progressions 题意: 给你一个长度为n的序列,问你这个序列中长度最长的等差数列长度为多少 题解: 方法一:将数组从小到大排序,n方扫,枚举出公差d,然后二分找有多 ...

  9. python常用序列list、tuples及矩阵库numpy的使用

    近期开始学习python机器学习的相关知识,为了使后续学习中避免编程遇到的基础问题,对python数组以及矩阵库numpy的使用进行总结,以此来加深和巩固自己以前所学的知识. Section One: ...

  10. need

    php面试题: http://lib.csdn.net/article/php/43624 小程序: 官方手册: https://mp.weixin.qq.com/debug/wxadoc/dev/d ...