jQuery maxlength文本字数限制插件
发布时间：2013-08-19 编辑：jiaochengji.com
相信大家对twitter类的微博客都不陌生,作为一句话博客其字数即时提示效果设计的非常人性化.
相信大家对twitter类的微博客都不陌生,作为一句话博客其字数即时提示效果设计的非常人性化.
实现这个效果有很多方法,这里就介绍一种jquery插件maxlength,它的使用非常简单,让我们先看看演示:
jquery maxlength演示地址
演示代码打包下载
看看Demo中的重点代码:
1.载入maxlength.js
<script type="text/javascript" src="maxlength.js"></script>
2.加入函数,Demo中有3个例子,你可以根据实际需要选择不同的函数,不过最后一个例子对于中文而言是无效的.
$(function () {
$('textarea.limited').maxlength({
'feedback' : '.charsLeft', 'useInput' : true
});
$('input.limited').maxlength({
'feedback' : '.charsLeft'
});
$('textarea.wordLimited').maxlength({
'words': true,
'feedback': '.wordsLeft', 'useInput' : true
});
});
3.调用
<form action="">
<p>可以输入 <span class="charsLeft">20</span> 个字符</p>
<textarea class="limited"></textarea>
<input type="hidden" name="maxlength" value="20" />
</form>
<form action="">
<p>可以输入 <span class="charsLeft">10</span> 个字符</p>
<input maxlength="10" class="limited" />
</form>
实现这个效果有很多方法,这里就介绍一种jquery插件maxlength,它的使用非常简单,让我们先看看演示:
jquery maxlength演示地址
演示代码打包下载
看看Demo中的重点代码:
1.载入maxlength.js
<script type="text/javascript" src="maxlength.js"></script>
2.加入函数,Demo中有3个例子,你可以根据实际需要选择不同的函数,不过最后一个例子对于中文而言是无效的.
复制代码 代码如下:
$(function () {
$('textarea.limited').maxlength({
'feedback' : '.charsLeft', 'useInput' : true
});
$('input.limited').maxlength({
'feedback' : '.charsLeft'
});
$('textarea.wordLimited').maxlength({
'words': true,
'feedback': '.wordsLeft', 'useInput' : true
});
});
3.调用
复制代码 代码如下:
<form action="">
<p>可以输入 <span class="charsLeft">20</span> 个字符</p>
<textarea class="limited"></textarea>
<input type="hidden" name="maxlength" value="20" />
</form>
<form action="">
<p>可以输入 <span class="charsLeft">10</span> 个字符</p>
<input maxlength="10" class="limited" />
</form>
一些必要的解释:
'useInput' : true 因为textarea需要借助input来实现,所以当你使用textarea的时候就需要这个参数
'feedback' : '.charsLeft' 是指即时显示的字数放入 class="charsLeft " 的容器中
input中设置最大数值直接用 maxlength="10"
textarea中的大数值需要设置与其对应input的value数值 value="20"
您可能感兴趣的文章：
jQuery maxlength文本字数限制插件
jquery maxlength使用说明
JQuery为textarea添加maxlength属性并且兼容IE
JQuery textarea添加maxlength属性的例子
JQuery为textarea添加maxlength属性的代码
jQuery 类twitter的文本字数限制带提示效果插件
限制字符输入数功能(jquery版和原生JS版)
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
文本框的字数限制功能jquery插件
jquery判断字符输入个数（数字英文长度记为1，中文记为2，超过长度自动截取）
[关闭]