jQuery 类twitter的文本字数限制带提示效果插件
更新时间：2010年04月16日 18:20:08 作者：
基于jquery的仿twitter的文本字数限制带提示效果插件，这里提示比较好，不是简单的限制，给用户更好的体验。
之前也介绍过一个类似效果的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>
演示代码
打包打包下载
简单的部署:
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>
演示代码
打包打包下载
相关文章
jquery 查找iframe父级页面元素的实现代码，学习jquery的朋友可以参考下。2011-08-08
这篇文章主要介绍了jQuery中的类名选择器（.class）用法,简单介绍了jQuery类名选择器的概念、原理并结合实例形式分析了类选择器的简单使用方法,需要的朋友可以参考下2018-05-05
在开发过程中经常会碰到让html组件不可输入(只读)，任何组件都有效的情况，接下来将为大家详细实现下，感兴趣的朋友可以参考下哈2013-04-04
为什么会出现在IE无效化呢，从上面的解决方案可以知道是XML文件的编码问题，在转化会前台可读时并未符合IE的XML 对象，故需要翻译成IE兼容的对象。2009-10-10
jQuery 1.3 和 Validation 验证插件1.5.1
jQuery 1.3已经新鲜出炉了，你可以通过jQuery 的官方博客查看相关细节。jQuery三岁了！2009-07-07
下面小编就为大家带来一篇设置jquery UI 控件的大小方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-12-12
今天小朋友写了个程式，出现乱码，将解决过程分享一下 为方便说明，将环境简化，vs.net 2003, jquery-1.3.2.js, web service调用2010-02-02
在前台的表格中单击单元格便可修改其中的内容，回车键保存修改的内容，esc撤销保存的内容2014-05-05
实现easyui的datagrid导出为excel的示例代码
下面小编就为大家带来一篇实现easyui的datagrid导出为excel的示例代码。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-11-11
jQuery height()、innerHeight()、outerHeight()函数的区别详解
这篇文章主要介绍了jQuery height()、innerHeight()、outerHeight()函数的区别详解,需要的朋友可以参考下2016-05-05
最新评论