jquery text文本框限制字数或文本框提示字数 超出不允许提交
jquery text文本框限制字数或文本框提示字数 超出不允许提交代码如下：<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8" />
<title>jquery text文本框限制字数或文本框提示字数 超出不允许提交</title>
<style type="text/css">
.disabled{background:#d4d0c8;}
</style>
</head>
<body>
<div class="commentbox clear">
<input id="wordtext" style="width:300px;" /><input type="button" value="提交" class="text" id="submit" />
<div id="wordage">我是提示的位置</div>
</div>
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
var limitNum = 20,pattern = '还可以输入' + limitNum + '字',wordage=$('#wordage'),wordtext=$('#wordtext'),submit=$('#submit');
wordage.html(pattern);
wordtext.keyup(
function(){
var remain = $(this).val().length;
if(remain > limitNum){
var result = limitNum - remain;
pattern = '已超出'+result+'字';
submit.attr('disabled','disabled').addClass('disabled');
}else{
var result = limitNum - remain;
pattern = '还可以输入' + result + '字';
submit.attr('disabled',false).removeClass('disabled');
}
wordage.html(pattern);
}
);
});
</script>
</body>
</html>
效果截图：
页:
[1]