基于jquery的让textarea自适应高度的插件


Posted in Javascript onAugust 03, 2010

Introduction
1. This textarea is like the google calendar's description when you create one new or update one existence calendar;
2. Its height will be changed accroding to user's input;
3. Its scrollbar is removed, which makes it much user friendly. I guess you may like it.

Using the code

1. import the jquery.js and textarea.js
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="js/textarea.js"></script>

2. add the following css
<style type="text/css">
.autoHeight{border:1px solid #666666; width:300px; height:60px; line-height:20px; font:11px verdana; overflow:hidden;}
</style>

3. add one textare html control
<textarea class="autoHeight" id="textarea1"></textarea>

4. make it works
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$(".autoHeight").TextAreaAutoHeight();
});
</script>

Javascript 相关文章推荐
写出更好的JavaScript之undefined篇(上)
Nov 22 Javascript
关于include标签导致js路径找不到的问题分析及解决
Jul 09 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
Jun 22 Javascript
Jquery Easyui验证组件ValidateBox使用详解(20)
Dec 18 Javascript
jQuery点击导航栏选中更换样式的实现代码
Jan 23 Javascript
node.js入门学习之url模块
Feb 25 Javascript
vue学习笔记之v-if和v-show的区别
Sep 20 Javascript
基于input动态模糊查询的实现方法
Dec 12 Javascript
JavaScript中 ES6变量的结构赋值
Jul 10 Javascript
Node.js 使用axios读写influxDB的方法示例
Oct 26 Javascript
微信小程序可滑动周日历组件使用详解
Oct 21 Javascript
微信小程序实现倒计时功能
Nov 19 Javascript
jQuery的实现原理的模拟代码 -4 重要的扩展函数 extend
Aug 03 #Javascript
jQuery的实现原理的模拟代码 -3 事件处理
Aug 03 #Javascript
SlideView 图片滑动(扩展/收缩)展示效果
Aug 01 #Javascript
JavaScript和ActionScript的交互实现代码
Aug 01 #Javascript
JavaScript判断窗口是否最小化的代码(跨浏览器)
Aug 01 #Javascript
jquery下onpropertychange事件的绑定方法
Aug 01 #Javascript
关于this和self的使用说明
Aug 01 #Javascript
You might like
攻克CakePHP系列三 表单数据增删改
2008/10/22 PHP
php空间不支持socket但支持curl时recaptcha的用法
2011/11/07 PHP
使用GD库生成带阴影文字的图片
2015/03/27 PHP
PHP+MySQL实现模糊查询员工信息功能示例
2018/06/01 PHP
php使用fullcalendar日历插件详解
2019/03/06 PHP
PHP简单验证码功能机制实例详解
2019/03/27 PHP
laravel-admin解决表单select联动时,编辑默认没选上的问题
2019/09/30 PHP
laravel config文件配置全局变量的例子
2019/10/13 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
jQuery 开发者应该注意的9个错误
2012/05/03 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
javascript获取鼠标点击元素对象(示例代码)
2013/12/20 Javascript
JS实现浏览器状态栏文字从右向左弹出效果代码
2015/10/27 Javascript
微信小程序技巧之show内容展示,上传文件编码问题
2017/01/23 Javascript
jQuery替换节点元素的操作方法
2018/03/18 jQuery
Vue实现按钮旋转和移动位置的实例代码
2018/08/09 Javascript
Vue2.0点击切换类名改变样式的方法
2018/08/22 Javascript
微信小程序实现折线图的示例代码
2019/06/07 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
react组件基本用法示例小结
2020/04/27 Javascript
[00:52]DOTA2国际邀请赛
2020/02/21 DOTA
TensorFlow如何实现反向传播
2018/02/06 Python
python实现邮件发送功能
2019/08/10 Python
Python处理session的方法整理
2019/08/29 Python
浅谈Python线程的同步互斥与死锁
2020/03/22 Python
Python高并发解决方案实现过程详解
2020/07/31 Python
清除canvas画布内容(点擦除+线擦除)
2020/08/12 HTML / CSS
玩具反斗城葡萄牙官方商城:Toys"R"Us葡萄牙
2016/10/21 全球购物
芭比波朗加拿大官方网站:Bobbi Brown Cosmetics CA
2020/11/05 全球购物
党员公开承诺践诺书
2014/03/25 职场文书
高中教师评语大全
2014/04/25 职场文书
创建绿色社区汇报材料
2014/08/22 职场文书
口才训练演讲稿范文
2014/09/16 职场文书
优秀团员事迹材料
2014/12/25 职场文书
建筑安全员岗位职责
2015/02/15 职场文书
2015年全国助残日活动方案
2015/05/04 职场文书