很多前端开发的朋友可能都会遇到textarea 输入框的高度不能自动随着用户的输入变化的问题,今儿小生也遇到了, 并通过网络上的信息解决了这个问题,于是将解决方法贴上,以作备忘。

  directiveApp.directive('autoHeight', function(){
function autoHeight(elem){
elem.style.height = 'auto';
elem.scrollTop = 0; //防抖动
elem.style.height = elem.scrollHeight + 'px';
} return {
scope: {},
link: function (scope, ele, attrs) {
var oriEle = $(ele).get(0);
$(oriEle).focus();
$(oriEle).bind('keyup click', function(e) {
autoHeight($(this).get(0));
});
var timer = setInterval(function(){
if($(oriEle).val()) {
autoHeight(oriEle);
clearInterval(timer);
}
}, 100);
}
};
});
Html code:
  <textarea auto-height></textarea>

  

不才,望谅。

Angular Textarea 高度自动变化的更多相关文章

  1. textarea高度自动增高

    <!--随着textarea 输入内容 自动增加高度--> <script type="text/javascript"> $(".input_t ...

  2. 父div高度不能根据子div高度自动变化的解决方案

    <div id="parent"> <div id="content"> </div> </div> 当cont ...

  3. textarea 高度自动

    <textarea id="suggest" type="text" name="suggest" class="form- ...

  4. react textArea 高度不变化问题

    ref={el =>{ if(el){ el.textareaRef.style.height = el.textareaRef.scrollHeight + 'px'; } } }

  5. html文本域textarea高度自增、自动换行

    文本域自动换行.高度自增,采用以下方式: html: <textarea rows="1" class="answerTextArea" maxlengt ...

  6. textarea 实现高度自动增长

    有时候希望textarea 能够自动调整高度来适应输入的内容 网上看到了很多解决方案,比如动态创建一个隐藏的div,当用户输入的时候将textarea的内容绑定到div,由于div的高度会自动撑开,因 ...

  7. textarea宽度、高度自动适应处理方法

    textarea自动高度 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http: ...

  8. textarea高度自适应自动展开

    在使用之前,推荐两个比较好的事件,分别是oninput和onpropertychange,IE9以下不兼容oninput.在textarea发生变化时,可以通过监听这两个事件来触发你需要的功能. te ...

  9. textarea高度跟随文字高度而变化

    html部分: <textarea id="textarea">哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽</textarea> js部分: < ...

随机推荐

  1. VMware vSphere 5.5的12个更新亮点(2)

    ACPI支持 以前版本的VMware虚拟机的局限性之一,是支持的虚拟设备数量甚少.vSphere 5.5引入了Virtual Hardware 10,这增加了基于SATA的虚拟设备节点,通过AHCI( ...

  2. C++类的继承实例

    首先由三个类分别为DateType(日期类).TimeType(时间类).DateTimeType(日期时间内).详细代码例如以下: #include <iostream> using n ...

  3. open(),close() 打开/关闭文件

    Open open()是一个系统调用函数,用来打开或创建一个文件,通过不同的oflag选项实现不同功能. 使用时open()函数需要包含的头文件:<sys/types.h>,<sys ...

  4. css_day7

  5. ASP.NET 根据现有动态页面生成静态Html

    现有动态页面的格式都是类似 pageName.aspx?ID=1的格式,后面由于发布服务器的原因,要求将动态页面转为静态html后上传. 首先根据页面生成的格式,枚举获取页面html: foreach ...

  6. ASP.Net MVC概念及基本

    1.1概念 MVC是一种软件设计模式,即:Model(模型).View(视图).Controller(控制器)  .其主要设计目标是将用户接口和逻辑层相分离,以便开发人员更好的关注逻辑层的设计和测试, ...

  7. MySQL 数据库入门操作

    启动mysqld:在命令行启动mysql时,如不加"--console",启动.关闭信息不在界面中显示,而是记录在安装目录下的data目录里,文件名一般是hostname.err, ...

  8. iOS_SN_Socket网络编程(一)

    1.Socket简介 首先让我们通过一张图知道socket在哪里? socket在哪里 Socket是应用层与TCP/IP协议族通信的中间软件抽象层,它是一组接口. 2.TCP和UDP的区别 在这里就 ...

  9. 浅谈Block传值-匿名函数(代码块)

    block传值是从后往前传值---代理也是 // 使用block时, 不能访问self, 也不能直接访问属性, self.属性, 用self调用方法; 只要这样做了, block都会对其强引用一份, ...

  10. 解决mini2440开发板和虚拟机相互ping不通

    很奇怪的事,前段时间使用都还是好好的,但今天不知什么原因开发板和虚拟机怎么也无法PING通. 虚拟机用的:fedora14 开发板IP:192.168.0.250 虚拟机IP:192.168.0.10 ...