jQuery 类twitter的文本字数限制带提示效果插件


Posted in Javascript onApril 16, 2010

之前也介绍过一个类似效果的JQuery插件jQuery maxlength文本字数限制插件,不过这次的charcount部署更简单,而且有超出数字提示的功能.
简单的部署:

1.载入js:

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/charCount.js"></script>

2.Html结构:
<form id="form" method="post" action=""> 
<h2>Default Usage</h2> 
<div> 
<label for="message">Type your message</label> 
<textarea id="message1" name="message1"></textarea> 
</div> 
<h2>Custom Usage</h2> 
<div> 
<label for="message">Another message (limited to 30, warning at 10)</label> 
<textarea id="message2" name="message2"></textarea> 
</div> 
</form>

3.charCount插件设置:
<script type="text/javascript"> 
$(document).ready(function(){ 
//default usage 
$("#message1").charCount(); 
//custom usage 
$("#message2").charCount({ 
allowed: 30, 
warning: 10, 
counterText: '剩余字数: ' 
}); 
}); 
</script>

演示代码
打包打包下载
Javascript 相关文章推荐
node.js中的fs.readlinkSync方法使用说明
Dec 17 Javascript
JavaScript获取Url里的参数
Dec 18 Javascript
jquery获取及设置outerhtml的方法
Mar 09 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 Javascript
利用Vue.js框架实现火车票查询系统(附源码)
Feb 27 Javascript
vue.js利用Object.defineProperty实现双向绑定
Mar 09 Javascript
浅谈对Angular中的生命周期钩子的理解
Jul 31 Javascript
JS对象与json字符串相互转换实现方法示例
Jun 14 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
为vue项目自动设置请求状态的配置方法
Jun 09 Javascript
JavaScript中var的重要性实例分析
Jul 09 Javascript
Postman内建变量常用方法实例解析
Jul 28 Javascript
jQuery maxlength文本字数限制插件
Apr 16 #Javascript
一款js和css代码压缩工具[附JAVA环境配置方法]
Apr 16 #Javascript
jQuery对象与DOM对象之间的转换方法
Apr 15 #Javascript
jquery中获得$.ajax()事件返回的值并添加事件的方法
Apr 15 #Javascript
网站导致浏览器崩溃的原因总结(多款浏览器) 推荐
Apr 15 #Javascript
jQuery 打造动态下滑菜单实现说明
Apr 15 #Javascript
xheditor与validate插件冲突的解决方案
Apr 15 #Javascript
You might like
php 定界符格式引起的错误
2011/05/24 PHP
php empty() 检查一个变量是否为空
2011/11/10 PHP
CodeIgniter使用smtp服务发送html邮件的方法
2015/06/10 PHP
PHP 500报错的快速解决方法
2016/12/14 PHP
thinkPHP5框架设置404、403等http状态页面的方法
2018/06/05 PHP
JavaScript实现的内存数据库LokiJS介绍和入门实例
2014/11/17 Javascript
Node.js中JavaScript操作MySQL的常用方法整理
2016/03/01 Javascript
jQuery实现布局高宽自适应的简单实例
2016/05/28 Javascript
老生常谈js数据类型
2017/08/03 Javascript
jquery操作ul的一些操作笔记整理(干货)
2017/08/31 jQuery
详解Vue路由钩子及应用场景(小结)
2017/11/07 Javascript
解决使用Vue.js显示数据的时,页面闪现原始代码的问题
2018/02/11 Javascript
JS动画定时器知识总结
2018/03/23 Javascript
nodeJS模块简单用法示例
2018/04/21 NodeJs
讲解vue-router之什么是动态路由
2018/05/28 Javascript
Babel 入门教程学习笔记
2018/06/13 Javascript
在 vue-cli v3.0 中使用 SCSS/SASS的方法
2018/06/14 Javascript
bootstrap下拉框动态赋值方法
2018/08/10 Javascript
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
2018/08/27 Javascript
python 文件与目录操作
2008/12/24 Python
Python中使用PyHook监听鼠标和键盘事件实例
2014/07/18 Python
Python2.x与Python3.x的区别
2016/01/14 Python
Python使用pickle模块存储数据报错解决示例代码
2018/01/26 Python
Linux(Redhat)安装python3.6虚拟环境(推荐)
2018/05/05 Python
python实现逐个读取txt字符并修改
2018/12/24 Python
python中property属性的介绍及其应用详解
2019/08/29 Python
CSS3 filter(滤镜)实现网页灰色或者黑色模式的代码
2020/11/30 HTML / CSS
随机分配座位,共50个学生,使学号相邻的同学座位不能相邻
2014/01/18 面试题
给分销商的致歉信
2014/01/14 职场文书
大学生两会学习心得体会
2014/03/10 职场文书
成龙霸王洗发水广告词
2014/03/14 职场文书
《金子》教学反思
2014/04/13 职场文书
政府个人对照检查材料
2014/08/28 职场文书
环境卫生倡议书
2014/08/29 职场文书
个人委托书范本
2014/09/13 职场文书
上课睡觉检讨书300字
2014/11/18 职场文书