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 相关文章推荐
JQuery 将元素显示在屏幕的中央的代码
Feb 27 Javascript
jquery.cvtooltip.js 基于jquery的气泡提示插件
Nov 19 Javascript
js Select下拉列表框进行多选、移除、交换内容的具体实现方法
Aug 13 Javascript
JS和JQUERY获取页面大小,滚动条位置,元素位置(示例代码)
Dec 14 Javascript
IE6已终止操作问题的2种情况及解决
Apr 23 Javascript
jquery分页插件jquery.pagination.js使用方法解析
Apr 01 Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
Nov 09 Javascript
浅谈Node.js:fs文件系统模块
Dec 08 Javascript
BootStrapTable服务器分页实例解析
Dec 20 Javascript
JS控制鼠标拒绝点击某一按钮的实例
Dec 29 Javascript
jquery实现简单自动轮播图效果
Jul 29 jQuery
js定时器出现第一次延迟的原因及解决方法
Jan 04 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最常用的ini函数分析 针对PHP.ini配置文件
2010/04/22 PHP
thinkphp 多表 事务详解
2013/06/17 PHP
PHP基于socket实现客户端和服务端通讯功能
2017/07/13 PHP
PHP tp5中使用原生sql查询代码实例
2020/10/28 PHP
JavaScript中的运算符种类及其规则介绍
2013/09/26 Javascript
JavaScript实现的日期控件具体代码
2013/11/18 Javascript
jQuery实现“扫码阅读”功能
2015/01/21 Javascript
使用JavaScript实现旋转的彩圈特效
2015/06/23 Javascript
分享一个原生的JavaScript拖动方法
2016/09/25 Javascript
js实现页面刷新滚动条位置不变
2016/11/27 Javascript
js实现增加数字显示的环形进度条效果
2017/02/05 Javascript
深入理解 JavaScript 中的 JSON
2017/04/06 Javascript
JS中this的指向以及call、apply的作用
2018/05/06 Javascript
JavaScript实现的DOM树遍历方法详解【二叉DOM树、多叉DOM树】
2018/05/07 Javascript
JavaScript执行环境及作用域链实例分析
2018/08/01 Javascript
vue-cli 打包后提交到线上出现 &quot;Uncaught SyntaxError:Unexpected token&quot; 报错
2018/11/06 Javascript
微信小程序实现滑动切换自定义页码的方法分析
2018/12/29 Javascript
vue使用openlayers实现移动点动画
2020/09/24 Javascript
[28:42]Ti4正赛VG vs NEWBEE1
2014/07/19 DOTA
Python Mysql数据库操作 Perl操作Mysql数据库
2009/01/12 Python
安装Python的web.py框架并从hello world开始编程
2015/04/25 Python
python中lambda与def用法对比实例分析
2015/04/30 Python
关于Numpy中的行向量和列向量详解
2019/11/30 Python
Python基于模块Paramiko实现SSHv2协议
2020/04/28 Python
Python格式化输出--%s,%d,%f的代码解析
2020/04/29 Python
使用Python将图片转正方形的两种方法实例代码详解
2020/04/29 Python
Pycharm生成可执行文件.exe的实现方法
2020/06/02 Python
Saucony澳大利亚官网:美国跑鞋品牌,运动鞋中的劳斯莱斯
2018/05/05 全球购物
自荐信范文
2013/12/10 职场文书
公益活动策划方案
2014/01/09 职场文书
班队活动设计方案
2014/01/30 职场文书
说明书怎么写
2014/05/06 职场文书
销售竞赛活动方案
2014/08/23 职场文书
乡镇创先争优活动总结
2014/08/28 职场文书
工厂仓管员岗位职责
2015/04/01 职场文书
HTML通过表单实现酒店筛选功能
2021/05/18 HTML / CSS