Textarea高度随内容自适应地增长,无滚动条
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<TITLE>枫芸志 » 文本框textarea高度自适应增长/伸缩</TITLE>
</HEAD>
<BODY>
<textarea id="txtContent" rows="5" cols="50" onkeyup="ResizeTextarea()" style="overflow-y:hidden;">Textarea高度随内容自适应地增长,无滚动条
晴枫制作
http://www.111cn.net</textarea>
<script type="text/javascript">
// 最小高度
var minRows = 5;
// 最大高度,超过则出现滚动条
var maxRows = 12;
function ResizeTextarea(){
var t = document.getElementById('txtContent');
if (t.scrollTop == 0) t.scrollTop=1;
while (t.scrollTop == 0){
if (t.rows > minRows)
t.rows--;
else
break;
t.scrollTop = 1;
if (t.rows < maxRows)
t.style.overflowY = "hidden";
if (t.scrollTop > 0){
t.rows++;
break;
}
}
while(t.scrollTop > 0){
if (t.rows < maxRows){
t.rows++;
if (t.scrollTop == 0) t.scrollTop=1;
}
else{
t.style.overflowY = "auto";
break;
}
}
}
</script>
</BODY>
</HTML>
Textarea高度随内容自适应地增长,无滚动条的更多相关文章
- textarea高度随内容自适应
最近遇到一个需求,视频名称初始有个生成值,并且支持可以手动修改,修改后名称过长后换行高度随内容增加.刚开始想到用input但是发现input不支持换行.后来用了textarea,用js来控制,下面是实 ...
- jQuery实现textarea高度根据内容自适应
//jQuery实现textarea高度根据内容自适应 $.fn.extend({ txtaAutoHeight: function () { return this.each(function () ...
- Jquery实现textarea根据文本内容自适应高度
本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...
- 文本框textarea根据输入内容自适应高度 和输入中文和数字换行解决方法
textarea内容可从后台读取或手动输入,常规输入后中文和数字会出现换行问题 <style> #textarea { display: block; margin: 0 auto; ov ...
- textarea高度随着内容的多少而变化,高度可以删减
问题:可以多行输入,并且输入框的高度随着内容的多少而变化,输入框的高度不能只增不减 由于 input 只能单行输入 textarea可以多行输入,并且高度可以随着内容的增加而增加,但是当内容删减的时候 ...
- iframe高度随内容自适应的方法
我们知道,iframe最大的问题,就是高度的问题,如果你内容的高度是变化,要么你就给你的容器写个固定的高度,如果内容是未知的,显然这个方法并不能达到我们的想要的效果,要么就是通过js来解决这个问题. ...
- 左边label随着右边textarea高度自适应
左边label随着右边自适应 近期项目中,有表单需求 默认展示两列,当内容多的时候,可以展示一列 左边列 <div> <label>备注</label> <s ...
- 实现textarea高度自适应内容,无滚动条
最近接触到一个很好用的js插件,可以实现textarea高度随内容增多而改变,并且不显示滚动条,推荐给大家: http://www.jacklmoore.com/autosize/
- html5 textarea 文本框根据输入内容自适应高度
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
随机推荐
- 操作系统:cpu调度 6-25
1. 进程选择 1小时和1分钟? 进程优先1分钟,再执行1小时. 时间短的进程先执行,执行顺序也有关. 2. 遇到io操作,执行的进程先让出cpu,切换其他进程. 3.进程先来先服务,进程调度策略: ...
- treap模版代码
treap模版暂存. 以后修改整理. #include<cstdio> #include<iostream> #include <time.h> #include& ...
- D.T SOFTWARE (1) 软件架构直播答疑课程
今晚的d.t课程 1项目需求 PPTP服务搭建完成PPTP服务器的搭建,用户重新拨号获得新IP后,要求拔PPTP VPN成功时,也获取到新的公网IP,而且能通过代理上网.VNC服务安装用户可以通过VN ...
- bind,call,apply区别
js中bind.call.apply函数的用法 2015-02-27 21:16:39 标签:javascript js bind call apply 原创作品,允许转载,转载时请务必以超链接形式 ...
- hd oj2025
Ps:尼玛这道题简直坑爹...就是直接比较ascii码....无脑题,想复杂了... 代码:#include "stdio.h"#include "string.h&qu ...
- 【Zhejiang University PATest】02-3. 求前缀表达式的值
算术表达式有前缀表示法.中缀表示法和后缀表示法等形式.前缀表达式指二元运算符位于两个运算数之前,例如2+3*(7-4)+8/4的前缀表达式是:+ + 2 * 3 - 7 4 / 8 4.请设计程序计算 ...
- 对前端mvc的认识和思考
现在,我们经常都可以看到复杂的JavaScript应用程序,由于这些应用程序变得越来越复杂,一长串的jQuery回调语句或者通过应用程序在 各个状态执行不同的函数调用,这些做法都会变得无法再让人接受, ...
- Linux iptables重启后失效
解决办法如下: 输入完iptables -t nat -A PREROUTING -p tcp --dport 80 -j REDIRECT --to-port 8080 后 执行iptables-s ...
- Redis - 常用命令操作
常用命令keys: keys * 查看符合条件的所有key exists: exists key 查看key是否存在 del: del k ...
- Java 集合深入理解(12):古老的 Vector
点击查看 Java 集合框架深入理解 系列, - ( ゜- ゜)つロ 乾杯~ 今天刮台风,躲屋里看看 Vector ! 都说 Vector 是线程安全的 ArrayList,今天来根据源码看看是不是这 ...