微博剩余字数输入统计
预览效果
HTML代码
<div class="cl share_weibo_wp" style="">
<div class="cl">
<h4 class="l">分享到微博</h4>
<span class="r count_txt">还能输入<strong id="currentLength">120</strong>字</span>
</div>
<textarea onkeyup="checkLength(this);" class="textarea radius inputstyle" name="" cols="" rows=""></textarea>
</div>
CSS代码
body{ background-color:#71C5F2}
.share_weibo_wp{width:480px; padding:20px; background-color:#fff; margin-left:auto; margin-right:auto; margin-top:20px;-khtml-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;behavior: url(ie-css3.htc)}
.count_txt{color: #B5B5B5;text-align: right}
.count_txt strong {font-family: georgia;font-size: 24px; padding: 0 2px}
.inputstyle {height: 75px;line-height: 18px;overflow-x: hidden;overflow-y: auto;width: 472px}
JS代码
function checkLength(which) {
var maxChars = 120;
if (which.value.length > maxChars)
which.value = which.value.substring(0,maxChars);
var curr = maxChars - which.value.length;
document.getElementById("currentLength").innerHTML = curr.toString()}