联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > 网页前端技术 > 正文

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

作者:98wpeu发布时间:2026-07-12分类:网页前端技术浏览:2


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

1.载入JS:
复制代码 代码如下:
<scripttype="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>

演示代码
打包打包下载

标签:插件字数文本提示效果Web


网页前端技术排行
最近发表
网站分类
标签列表