<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. plSql读取Oracle数据库中文乱码

    新建环境变量,设置变量名:NLS_LANG,变量值:SIMPLIFIED CHINESE_CHINA.ZHS16GBK,确定即可

  2. Laravel之Ueditor

    1.访问网址http://ueditor.baidu.com/website/download.html下载合适的编辑器版本 2.按照插件包中的index.html样式,布局页面 3.如果需要使用表单 ...

  3. Python FFT (Fast Fourier Transform)

    np.fft.fft import matplotlib.pyplot as plt import plotly.plotly as py import numpy as np # Learn abo ...

  4. Android 显示html标签或者带图片

    Android中显示html文件要用Html.fromHtml(...)处理过的返回值,返回值可以成为setText()的参数. 只显示带文本的html可以用下面的方法处理html文件. public ...

  5. Breakpoint debugging

    断点调试的作用: A:查看程序的执行流程. B:调试程序. package basic.java; public class DebugTest { public static void main(S ...

  6. zabbix共享内存报错cannot create semaphore set

    zabbix共享内存报错 cannot open log: cannot create semaphore set: [28] No space left on device 报错原因: kernel ...

  7. java线程操作

    目录 前言 创建多线程的方式 1继承thread抽象类 2实现Runnable接口 3实现Callable接口 匿名内部类 线程池 线程安全 同步代码块 同步方法 锁机制 线程状态 前言 进程:内存运 ...

  8. mysql索引小记

    Mysql索引分为以下几类:FULLTEXT, HASH,BTREE,RTREE. FULLTEXT:全文搜索索引 主要是解决'ad%'这样的查询效率低的问题,只能是MyISAM和InnoDB引擎上使 ...

  9. web前端与后端的理解区分

    要了解web前后端的区别,首先必须得清楚什么是web前端和web后端. 首先:web的本意是蜘蛛网和网的意思,在网页设计中我们称为网页的意思.现广泛译作网络.互联网等技术领域.表现为三种形式,即超文本 ...

  10. 全网数据实时备份方案[inotify,sersync]

    环境搭建 0.环境安装   gcc  yum install gcc -y 1.安装inotify(源码软件包) 文件下载:https://files.cnblogs.com/files/ftl101 ...