`

textarea 输入框自适应高度

阅读更多

 

 jQuery • textareaAutoHeight Plugin

功能: <textarea/>输入框自适应高度
特点: 支持剪切/粘贴, 不闪屏, 体积迷你(不到1k)
兼容: 几乎所有主流浏览器(国内山寨货未测试)
演示: 见小站文章页底部的评论输入框

使用方法:
0. 检查CSS文件中所有textarea的line-height值, 若是纯数字, 给它加上单位em, 如: 1.5em. 否则IE(6|7|8)下插件失效.
1. 加载jQuery库(1.4+)
2. 加载textareaAutoHeight.js
3. 使用以下接口调用插件:
$('textarea').tah({
    moreSpace:15,   //输入框底部预留的空白, 默认15, 单位像素
    maxHeight:600,  //指定Textarea的最大高度, 默认600, 单位像素
    animateDur:200  //调整高度时的动画过渡时间, 默认200, 单位毫秒
});

 

 

 

主页:http://phoetry.me/archives/tah.html

下载:http://phoetry.me/archives/tah.html

示例:http://phoetry.me/archives/tah.html

 

 

 

http://www.open-open.com/ajax/ajax20111115104209.htm

分享到:
评论

相关推荐

    微信小程序 内容自适应textarea表单组件(autoheight_textarea)

    textarea根据内容自适应高度 组件 注意:要监听input事件改变value值 使用: &lt;autoheight_textarea value="{{value}}" placeholder="写个评论" bindinput="listenerinput"&gt;&lt;/autoheight_textarea&gt;

    Vue下textarea文本框根据内容自适应改变高度

    Vue自定义组件实现文本框根据文本内容自适应高度的效果,解决若输入文本量或显示文本量超过指定行数后,会出现垂直滚动条,但在IE环境下,该滚动条是隐藏的问题。

    多行输入框自适应行数.html

    核心代码" &lt;textarea rows=1 style="font-size:16px; line-height:1.6em;" onkeyup="this.style.height=this.scrollHeight-4+'px'"&gt; &lt;/textarea&gt;

    auto-textarea:基于Vue的高度自适应文本输入框

    基于Vue的高度自适应文本输入框 Use Setup (开始) Install auto-textarea (安装) $ npm install auto-textarea --save package.json "auto-textarea": "^1.3.6" Use (如何引入) // 方法一 // import with ES6 ...

    jquery实现textarea 高度自适应

    之前给大家分享过用Javascript控制文本框textarea高度随内容自适应增长收缩,今天花了点时间换了种实现方法,总结一下 代码如下: jQuery.fn.extend({  autoHeight: function(){  return this.each(function(){  ...

    解决Layui 表格自适应高度的问题

    今天小编就为大家分享一篇解决Lyaui 表格自适应高度的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

    textarea自适应高度插件textareaAutoHeight.zip

    使用以下接口调用插件:$('textarea').tah({ moreSpace:15, //输入框底部预留的空白, 默认15, 单位像素 maxHeight:600, //指定Textarea的最大高度, 默认600, 单位像素 animateDur:200 //调整高度时的动画过渡...

    css textarea 高度自适应,无滚动条

    用css控制textarea文本域的高度随内容的变化而变化,不出现滚动条.

    div实现自适应高度的textarea实现angular双向绑定

    过程中我遇到的一个问题就是QQ输入框,自适应高度,最高高度为3row。 如果你也像我一样打算使用textarea,那么很抱歉,你一开始就错了。 textarea不是不可以的,然后我是这样错的。(就是监听scroll 如果出现了,就...

    div模拟textarea文本域实现高度自适应效果代码

    textarea标签为表单元素,一般用在多行文字的输入。在web应用上常见的是评论输入框,微博信息输入框等。

    my-textarea.vue

    基于uniapp开发的计数输入框,计数数字支持垂直居中或者在右下角,可以固定高度或者自适应高度:

    随文字增加高度改变

    随着你写入的文字增加输入框高度改变 textarea.........

    flutter TextField换行自适应的实现

    无论哪种界面框架输入文本框都是非常重要的控件, 但是发现flutter中的输入框TextField介绍的虽然多,但是各个属性怎么组合满足需要很多文章却说不清楚, 再加上控件版本变更频繁很多功能的介绍都是比较陈旧的属性....

    55种网页小技巧 ---- 下载无需扣分,具有一定收藏价值

    TEXTAREA自适应文字行数的多少.html title显示日期.html 不准粘贴.html 不能为空和邮件地址的约束.html 不要滚动条.html 光标是停在文本框文字的最后.html 关闭输入法.html 删除时确认.html 判断上一页的...

    《程序天下:JavaScript实例自学手册》光盘源码

    5.8 iframe自适应高度 5.9 类似MSN的消息提示 5.10 只打印iframe的内容 第6章 下拉列表特效 6.1 下拉框实现多选 6.2 实现两个select的同步 6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉...

    程序天下:JavaScript实例自学手册

    5.8 iframe自适应高度 5.9 类似MSN的消息提示 5.10 只打印iframe的内容 第6章 下拉列表特效 6.1 下拉框实现多选 6.2 实现两个select的同步 6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉...

    ExtJSWeb应用程序开发指南(第2版)

    4.1.6 Ext.form.field.Number数字输入框 4.1.7 Ext.form.field.Checkbox复选框和Ext.form.field.Radio单选框 4.1.8 Ext.form.CheckboxGroup和Ext.form.RadioGroup 4.1.9 Ext.form.field.Trigger触发字段 4.1.10 ...

Global site tag (gtag.js) - Google Analytics