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

基于jquery的仿twitter的文本字数限制带提示效果插件,这里提示比较好,不是简单的限制,给用户更好的体验。

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

1.载入js:

复制代码 代码如下:


<script type="text/javascript" src="https://www.jb51.net/js/jquery.js"></script>
<script type="text/javascript" src="https://www.jb51.net/js/charCount.js"></script>


2.Html结构:

复制代码 代码如下:


<form method="post" action="">
<h2>Default Usage</h2>
<div>
<label for="message">Type your message</label>
<textarea></textarea>
</div>
<h2>Custom Usage</h2>
<div>
<label for="message">Another message (limited to 30, warning at 10)</label>
<textarea></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>


演示代码
打包打包下载

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdsyjs.html