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 ...
随机推荐
- 去掉NavigationBar底部的黑线
UINavigationBar *navigationBar = self.navigationController.navigationBar; [navigationBar setBackgr ...
- web api post传一个参数时 值永远是null
这个问题纠结了我一个早上,不管用什么样的传参方法,走到控制器中,那个参数永远不变的等于null 在网上找了很多解决方案 上面这个是从网上截图的,第一:要将参数标记为[FromBody],变为简单参数 ...
- 王家卫i
〈旺角卡门〉 因为我很了解我自己,我不能对你承诺什么. 你不要说两次,说两次我就相信了. 我宁愿做一日英雄,都不想成世做条虫! 厨房里有煮好的饭,另外我还买了几个杯子,我知道,用不了多久就都会被打破, ...
- CentOS中vsftp安装与配置
http://blog.chinaunix.net/uid-7271021-id-3086186.html 553 Could not create file 解决办法 [root@localhost ...
- BZOJ 1600 建造栅栏
O(N)分成1,2与3,4两部分搞一搞. #include<iostream> #include<cstdio> #include<cstring> #includ ...
- Comments
Nothing can be quite so helpful as a well-placed comment.Nothing can clutter up a module more than f ...
- iOS开发:cocoapods的使用
Cocoapods是OS X和iOS下的一个第三方类库管理工具,通过CocoaPods工具我们可以为项目添加各种依赖库,减少了我们手动引入库需要的各种配置,同时使用cocoapods可以方便的查找新的 ...
- Codeforces Round #365 (Div. 2)-D Mishka and Interesting sum(树状数组)
题目链接:http://codeforces.com/contest/703/problem/D 思路:看了神犇的代码写的... 偶数个相同的数异或结果为0,所以区间ans[l , r]=区间[l , ...
- Linux 基础入门(新版)(实验一至实验四)
1.实验一 Lniux简介 操作系统:系统调用+内核 Linux 平台:大都为开源自由软件,用户可以修改定制和再发布,由于基本免费没有资金支持,部分软件质量和体验欠缺:有全球所有的 Linux ...
- asp.net mvc3.0第一个程序helloworld开发图解
步骤一:新建asp.net mvc3.0项目 (选择Razor模板) 步骤二:创建控制器 步骤三:控制器源码内右键创建对应视图 步骤四:控制器内添加代码 步骤五:视图页面输出内容 步骤六:F5调试