textarea输入框随内容撑开高度
方法一(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输入框随内容撑开高度的更多相关文章
- Jquery实现textarea根据文本内容自适应高度
本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...
- 文本框textarea根据输入内容自适应高度 和输入中文和数字换行解决方法
textarea内容可从后台读取或手动输入,常规输入后中文和数字会出现换行问题 <style> #textarea { display: block; margin: 0 auto; ov ...
- textarea文本域轻松实现高度自适应
转载:http://www.xuanfengge.com/textarea-on-how-to-achieve-a-high-degree-of-adaptive.html 今天需要些一个回复评论的页 ...
- html5 textarea 文本框根据输入内容自适应高度
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- div模拟textarea文本域轻松实现高度自适应——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...
- UIWebView中加载HTML的Table,td设置百分比宽度并且宽度不被里面的内容撑开
正常情况下,iOS使用WebView加载HTML的Table时,为了让Table适应屏幕宽度,会使用百分比设置td的宽度,但是由于td中的内容过多,td会被撑开,导致整个Table的宽度会变宽,超出屏 ...
- textarea输入框限制字数(JS)
第一种: <textarea onkeyup="checkLen(this)"></textarea> <div>您还可以输入 <span ...
- 设置DIV根据内容自动调整高度的三个方法
Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid=&qu ...
- 工作记录(JS向textarea添加固定内容、通过固定字符将字符串分割为数组)
第一个是在 textarea 输入框中添加固定的内容. 代码如下: <textarea id="text" cols="30" rows="10 ...
随机推荐
- PAT L1 - 056 猜数字
https://pintia.cn/problem-sets/994805046380707840/problems/994805074646122496 一群人坐在一起,每人猜一个 100 以内的数 ...
- 关于初装kali linux 2.0时DEB文件安装失败的问题
kali linux 是一个基于debian 的linux发行版本,支持deb文件格式的图形化安装. 刚装上kali linux时安装程序总是失败,提示处理时错误. 经过一番爬贴,是软件源的原因,解决 ...
- [乱搞]hdu 6406 Taotao picks apples 笛卡尔树+倍增
题目链接 Problem Description There is an apple tree in front of Taotao's house. When autumn comes, n app ...
- WEB测试基础
一.输入框1.字符型输入框:(1)字符型输入框:英文全角.英文半角.数字.空或者空格.特殊字符“~!@#¥%……&*?[]{}”特别要注意单引号和&符号.禁止直接输入特殊字符时,使用“ ...
- Qt浅谈内存泄露(总结)
Qt浅谈内存泄露(总结) 来源 http://blog.csdn.net/taiyang1987912/article/details/29271549 一.简介 Qt内存管理机制:Qt 在内部能够维 ...
- BZOJ4152:[AMPPZ2014]The Captain——题解
https://www.lydsy.com/JudgeOnline/problem.php?id=4152 给定平面上的n个点,定义(x1,y1)到(x2,y2)的费用为min(|x1-x2|,|y1 ...
- BZOJ5314 [Jsoi2018]潜入行动 【背包类树形dp】
题目链接 BZOJ5314 题解 设\(f[i][j][0|1][0|1]\)表示\(i\)为根的子树,用了\(j\)个监测器,\(i\)节点是否被控制,\(i\)节点是否放置的方案数 然后转移即可 ...
- 洛谷 P4027 [NOI2007]货币兑换 解题报告
P4027 [NOI2007]货币兑换 题目描述 小 \(Y\) 最近在一家金券交易所工作.该金券交易所只发行交易两种金券:\(A\) 纪念券(以下简称 \(A\) 券)和 \(B\) 纪念券(以下简 ...
- 洛谷 P2604 [ZJOI2010]网络扩容 解题报告
P2604 [ZJOI2010]网络扩容 题目描述 给定一张有向图,每条边都有一个容量C和一个扩容费用W.这里扩容费用是指将容量扩大1所需的费用.求: 1. 在不扩容的情况下,1到N的最大流: 2. ...
- 使图片相对于上层DIV始终水平、垂直都居中
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...