让textarea自动调整大小的js代码

代码如下:

<!doctype html>
<html>
<head>
<title>自动调整大小的textarea </title>
<meta charset = "utf-8" />
<style type = "text/css">
.editable{cursor:text; font-size:13px; color:#003366;width:80px;line-height:20px;height:20px;font-family:Arial;cursor:text;*overflow-y:hidden; }
</style>
</head>
<body>
<textarea class='editable' onkeydown ="if(event.keyCode==13) return false; " oninput="this.style.height='0px';this.style.height=(this.scrollHeight+'px');" onpropertychange="this.style.height=(this.scrollHeight+'px')" /></textarea>
</body>
</html>

赞 (0)

相关推荐

  • JavaScript实现统计文本框Textarea字数增强用户体验

    现在流行的Twitter等微博客网站,有一个很好的用户体验,就是在文本框中输入文字的时候,会自动统计输入的字符,并显示用户还能输入的字符,在限制了140个字的微博客中,这样的小提示可以很好的增强用户体验. 如果实现这种技术呢,我进行了一些研究,发现实现其实挺简单,几行代码就能完成输入字符统计功能,经过实际测试,其对文字的统计与Twitter等微博客的完全相同. 使用方法是,先增加一个span,用于显示剩余的字数,然后在Textarea中,加入一个onkeydown和onkeyup的事件,调用另一

  • TextArea不支持maxlength的解决办法(jquery)

    用.net 控件久了,在给一个页面的TextBox 增加控制长度的控制时,简单的加了一个maxlength='xxx' 就行,可是测试确总是不过,原因是设置了多行模式,在这样的情况下生成的html代码就是textarea,同时maxlength属性就没有被增加上,因为IE不支持textarea 的 maxlength属性,于是,在firefox 6中测试,发现firefox是支持这个属性的.那么就简单了.自己写了一个jquery的扩展,这样就可以很容易实现对textarea控制最大长度了. 扩展

  • JS TextArea字符串长度限制代码集合

    复制代码 代码如下: <html> <body> <textarea id="t"></textarea> <input type="text" id="b2" /> <script type="text/javascript"> textAreaLimit("t",{lastMsgLabel:"b2"}) func

  • 非主流的textarea自增长实现js代码

    其中大部分是靠scrollHeight(非W3C标准,由IE引入),keyup事件来完成.有一种比较有意思的是 通过"镜像元素(mirror element)", 和setTimeout轮询实现.大致的实现思路如下: 把一个单独的pre元素,通过position:absolute的方式定位于client view之外,并且把它和textarea的样式设置的一样,我们把这个pre元素称为"mirror",然后通过setTimeout进行200ms的轮询,把textar

  • Javascript 文本框textarea高度随内容自适应增长收缩

    直接上代码: 方案一: 枫芸志 » 文本框textarea高度自适应增长/伸缩 textarea { height:100px; width: 300px; } 晴枫制作 http://jb51.net // 最小高度 var minHeight = 100; // 最大高度,超过则出现滚动条 var maxHeight = 300; function ResizeTextarea(){ var t = document.getElementById('txtContent'); h = t.s

  • js限制textarea每行输入字符串长度的代码

    但是textarea没有这个属性. asp.net的服务端textbox这个属性也不起效,所以我们只有用js脚本来控制 好,废话不多说,先上代码 javascipt源码: 复制代码 代码如下: function textCounter(field, maxlimit, lines) {//参数说明:field是textarea对象,maxlimit是最大允许长度,lines是行数 var arr = field.value.split("\n");//首先我们要为验证行数,通过分行符&

  • javascript textarea光标定位方法(兼容IE和FF)

    今天在做一个博客转发的功能,就像新浪微薄转播的那个功能一样,有一个textArea,就是我们发微薄的那个框,别人的微薄都有一个转发的按钮,当我们点击这个转发按钮的时候,他的微薄就会进入到textArea中,看起来很简单的文本框赋值,其实难点就在于,这时候的光标是定位在最前面的. 于是搜索了baidu,google,找到了 IE下面的方法 复制代码 代码如下: var tea=document.getElementById("文本框的ID"); var txt=textArea.crea

  • 基于jQuery的让textarea支持Ctrl+Z步步撤销功能

    代码相对不多. 主要的是: 复制代码 代码如下: var log = []; $(function () { var txt = window.setInterval(function () { if (log[log.length - 1] != $("#t").val()) { log[log.length] = $("#t").val(); } }, 1500); var isCtrl = false; $(document).keydown(function

  • js操作textarea 常用方法总结

    在DOM里面操作textarea里面的字符,是比较麻烦的. 于是我有这个封装分享给大家,测试过IE6,8, firefox ,chrome, opera , safari.兼容没问题. 注意:在firefox下 添加字符串的时候有个bug 就是scrollTop 会等于0,当然解决了,但是不够完美.如果有高手也研究过,麻烦指点下. 复制代码 代码如下: var TT = { /* * 获取光标位置 * @Method getCursorPosition * @param t element *

  • 新浪微博字数统计 textarea字数统计实现代码

    复制代码 代码如下: /* * 从新浪微博上抄的 * */ var getLength = (function(){ var trim = function(h) { try { return h.replace(/^\s+|\s+$/g, "") } catch(j) { return h } } var byteLength = function(b) { if (typeof b == "undefined") { return 0 } var a = b.m

随机推荐