<script src="https://cdn.bootcss.com/jquery/1.8.1/jquery.js"></script>
<script>
$(function(){
function autoHeight(ele){
var $this = $(ele);
$this.css({'height':'20px','overflow-y':'hidden'}).height(ele.scrollHeight);
if(parseInt($this.height())>60){
$this.height(60);
}
}
$('.text').on('input propertychange',function(){
autoHeight(this);
})
    $('.text').trigger("input");
$('.text').trigger("propertychange");
})
 }) </script>
<textarea name="message"  class="text"></textarea>

textarea多行文本框自适应高度的更多相关文章

  1. textarea框自适应高度

    export function autoTextarea(elem, extra, maxHeight){ /**textarea文本域随内容的多少而调整高度 */ extra = extra || ...

  2. 如何在textarea多行文本框中设置滚动条样式

    其中设置滚动条的组成都有以下部分 ::-webkit-scrollbar 滚动条整体部分 ::-webkit-scrollbar-thumb  滚动条里面的小方块,能向上向下移动(或往左往右移动,取决 ...

  3. Textarea随着文本的字数自适应高度,后来发现用 contenteditable 代替textarea 效果更佳

    做移动端项目遇到很多问题,最近比如textarea 随着文本的字数自动撑开高度, 网上也查阅了一些资料发现比较有用的方法 就是获取 textarea的行数和换行符来动态改变textarea的高度  就 ...

  4. CSS——textarea多行文本框禁止拖动问题解决

    文本框这样配置就好 textarea{ resize:none; }

  5. angular指令系列---多行文本框自动高度

    angular.module('MyApp') .directive('autoTextare', ['$timeout', function ($timeout) { return { restri ...

  6. html5 textarea 文本框根据输入内容自适应高度

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. Jquery实现textarea根据文本内容自适应高度

    本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...

  8. 将textarea实现自适应高度及IE下滚动条不出现的bug

    1.<el-table-column label="备注" width="180"> <template scope="scope& ...

  9. div模拟textarea自适应高度

    之前在公司做项目的时候,有这么一个需求,要我写一个评论框,可以随着评论的行数增加而自动扩大,最开始我想用textarea实现,但是后来尝试后发现textarea并不适合,textarea的高度不会随着 ...

随机推荐

  1. #if, #elif, #else, #endif 使用

    程序想要通过简单地设置一些参数就生成一个不同的软件,在不同的情况下可能只用到一部分代码,就没必要把所有的代码都写进去,就可以用条件编译,通过预编译指令设置编译条件,在不同的需要时编译不同的代码. (一 ...

  2. 循环遍历正则验证input框内容合法性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. python中字符串格式化%与.format

    Python的字符串格式化有两种方式: 百分号方式.format方式 百分号的方式相对来说比较老,而format方式则是比较先进的方式,企图替换古老的方式,目前两者并存.[PEP-3101] This ...

  4. 创建一个Dribbble的作品展示

    Most designers on dribbble have a personal portfolio website that usually consists of a name and a b ...

  5. laravel开发之-composer安装(windows)

    1 在https://getcomposer.org/download/中下载composer.exe 2 选择php.exe安装composer 3 cmd命令框中输入composer.查看是否安装 ...

  6. 下载 github 项目文件到本地方法

    下载 github 项目文件到本地方法 本篇终极,收集 3 种方法 最厉害 666 的方法 直接访问网站: 操作如下: 本地工具版下载方法 首先需要下载 git 客户端 我就不转载了,上面有客户端的使 ...

  7. Django objects.all() ,objects.get() ,objects.filter()之间的区别

    ret=UserInfo.objects.all() all返回的是QuerySet对象,程序并没有真的在数据库中执行SQL语句查询数据,但支持迭代,使用for循环可以获取数据. ret=UserIn ...

  8. 使用iCarousel的旋转木马效果请求图片

    使用iCarousel的旋转木马效果请求图片 https://github.com/nicklockwood/iCarousel 先看看效果: 源码如下: // // RootViewControll ...

  9. Java学习---传输安全设计

    1.计算机安全的概念 用于保护数据和阻止Hacker的工具统称为计算机安全(Computer Security).信息安全最基本的方法就是利用加密信息防止未授权的人窃听,加密是以某种特殊的算法改变原有 ...

  10. Java实例---简单的上课管理系统

    源码分析 Course.java package com.ftl.many2many; import java.util.*; public class Course { private int cr ...