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 相关文章推荐
云网广告中的代码,提示出错,大家找找
Nov 21 Javascript
JS 创建对象(常见的几种方法)
Nov 03 Javascript
如何确保JavaScript的执行顺序 之实战篇
Mar 03 Javascript
js实现网页倒计时、网站已运行时间功能的代码3例
Apr 14 Javascript
node.js 动态执行脚本
Jun 02 Javascript
分享bootstrap学习笔记心得(组件及其属性)
Jan 11 Javascript
js css自定义分页效果
Feb 24 Javascript
详解JavaScript对象的深浅复制
Mar 30 Javascript
js实现适配不同的屏幕大小
Apr 10 Javascript
vue实现移动端图片裁剪上传功能
Aug 18 Javascript
Vue 中使用 CSS Modules优雅方法
Apr 09 Javascript
深入理解javascript中的this
Feb 08 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封装的字符串加密解密函数
2015/12/18 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
thinkPHP实现基于ajax的评论回复功能
2018/06/22 PHP
Javascript浅谈之引用类型
2013/12/18 Javascript
捕获和分析JavaScript Error的方法
2014/03/25 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
2015/08/27 Javascript
JS遍历数组和对象的区别及递归遍历对象、数组、属性的方法详解
2016/06/14 Javascript
JS实现漂亮的时间选择框效果
2016/08/20 Javascript
谈谈对JavaScript原生拖放的深入理解
2016/09/20 Javascript
jQuery解析XML 详解及方法总结
2016/09/28 Javascript
JS获得多个同name 的input输入框的值的实现方法
2017/01/09 Javascript
Vue.js基础知识小结
2017/01/13 Javascript
js数字计算 误差问题的快速解决方法
2017/02/28 Javascript
Vue.js表单标签中的单选按钮、复选按钮和下拉列表的取值问题
2017/11/22 Javascript
详解JavaScript类型判断的四种方法
2020/10/21 Javascript
Python中条件选择和循环语句使用方法介绍
2013/03/13 Python
用python读写excel的方法
2014/11/18 Python
python日期时间转为字符串或者格式化输出的实例
2018/05/29 Python
Python2.7.10以上pip更新及其他包的安装教程
2018/06/12 Python
Python实现二维曲线拟合的方法
2018/12/29 Python
用Python逐行分析文件方法
2019/01/28 Python
详解Python3中的 input() 函数
2020/03/18 Python
Python-jenkins 获取job构建信息方式
2020/05/12 Python
基于Python中Remove函数的用法讨论
2020/12/11 Python
全面解析CSS Media媒体查询使用操作(推荐)
2017/08/15 HTML / CSS
在C++ 程序中调用被C 编译器编译后的函数,为什么要加extern "C"
2014/08/09 面试题
英智兴达软件测试笔试题
2016/10/12 面试题
清明节网上祭英烈活动总结
2014/04/30 职场文书
2014年教育教学工作总结
2014/11/13 职场文书
人事文员岗位职责
2015/02/04 职场文书
先进教师个人总结
2015/02/11 职场文书
2015年教师见习期工作总结
2015/05/20 职场文书
担保书怎么写 ?
2019/04/22 职场文书
jdbc使用PreparedStatement批量插入数据的方法
2021/04/27 MySQL
sql server删除前1000行数据的方法实例
2021/08/30 SQL Server
利用Python实现翻译HTML中的文本字符串
2022/06/21 Python