首页 > 代码库 > 边输入边提示字数的文本 ()可直接引用)
边输入边提示字数的文本 ()可直接引用)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>边输入边提示字数的文本</title>
<script src="http://www.mamicode.com/js/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<div class="replyAnswerDiv">
<textarea onkeyup="checkLength(this);">向大家介绍一下自己吧!</textarea>
<span><em id="say">0</em>/100字</span>
</div>
<!-- js 开始 -->
<script type="text/javascript">
function checkLength(which) {
//设置限制输入的字数
var maxChars = 100;
if(which.value.length > maxChars){
// 超过限制的字数了就将 文本框中的内容按规定的字数 截取
which.value = http://www.mamicode.com/which.value.substring(0,maxChars);
return false;
}else{
// 判断是否输入了空格
which.value = http://www.mamicode.com/$.trim(which.value);
// alert(which.value.length)当前输入的字数
document.getElementById("say").innerHTML = which.value.length;
return true;
}
}
$(".replyAnswerDiv textarea").focus(function(){
$(this).text(" ").addClass("defaultColor");
});
$(".replyAnswerDiv textarea").blur(function(){
if($(".replyAnswerDiv textarea").text("")){
$(".replyAnswerDiv textarea").text("向大家介绍一下自己吧!");
}
});
</script>
</body>
</html>
边输入边提示字数的文本 ()可直接引用)