您的位置:首页 > Web前端 > JQuery

Jquery 限制文本框输入字数

2012-09-15 12:21 309 查看
<div class="right">
<p>
<textarea id="caseContent" name="caseContent" maxlength="200" class="area"></textarea>
</p>
<p>
<input type="submit" value="提交评论" class="sub_bt">
<script type="text/javascript">
$(function () {
//匹配包含给定属性的元素,keyup在按键释放时发生
$("#caseContent").keyup(function () {
var area = $(this);
//parseInt 方法返回与保存在 numString 中的数字值相等的整数。如果 numString 的前缀不能解释为整数,则返回 NaN(而不是数字)。
var max = parseInt(area.attr("maxlength"), 10); //获取maxlength的值 转化为10进制,将输入到textarea的文本长度
//这个判断可知max得到的是不是数字,设定的大小是多少
if (max > 0) {

if (area.val().length > max) { //textarea的文本长度大于maxlength
area.val(area.val().substr(0, max)); //截断textarea的文本重新赋值
}

var yishu = area.val().length;
var sheng = max - area.val().length;
$("#lyishu").html(yishu);
$("#lsheng").html(sheng);
}
});
$("#caseContent").blur(function () {
var area = $(this);
var max = parseInt(area.attr("maxlength"), 10); //获取maxlength的值
if (max > 0) {

if (area.val().length > max) { //textarea的文本长度大于maxlength
area.val(area.val().substr(0, max)); //截断textarea的文本重新赋值
}

var yishu = area.val().length;
var sheng = max - area.val().length;
$("#lyishu").html(yishu);
$("#lsheng").html(sheng);
}
});

});

</script>
已输入 <label id="lyishu" >0</label>  个字符,还可输入 <label id="lsheng" >200</label> 个字符</p>
</div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: