摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>微博限制字数</title> <style> .wb-k{width: 608px;height: 170px;border:8px&n
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>微博限制字数</title>
<style>
.wb-k{width: 608px;height: 170px;border:8px solid #FFBDBE; margin:0 auto;padding:10px;}
img{float:left;height: 35px}
.wb-r{float: right;font-size: 14px; color:#ccc;line-height: 35px}
#text{width:600px ;height: 100px}
#bz,#bz1,#bz2,#bz3,#bz4,#bz5{font-size: 14px; color:#888;line-height:35px;height: 35px;padding-left: 30px}
#bz{background: url(a1.png) no-repeat center left;}
#bz1{background: url(a2.png) no-repeat center left;}
#bz2{background: url(a3.png) no-repeat center left;}
#bz3{background: url(a4.png) no-repeat center left;}
#bz4{background: url(a5.png) no-repeat center left;}
#bzf{background: #ff8140; color: #fff;font-size: 15px;border: none;width: 100px;height: 30px;float: right;}
</style>
<script tpye="txet/javascript">
var box,text,m
window.onload=function (){
box=document.getElementById('box')
text=document.getElementById('text')
bzf=document.getElementById('bzf')
text.onkeyup=function aa(){
m=140-text.value.length//限制微博字数140
if(m<0){
box.style.color="red"
}else{
box.style.color="#888"
}
box.innerHTML=m
}
bzf.onclick=function (){
if (m==140) {
alert("请输入文字")
text.focus()
}else if (m<0) {
alert("字数太多，请重新输入")
text.focus()
}else{
alert("发布成功")
text.focus()
}
}
aa()
}
</script>
</head>
<body>
<div>
<img src="x.png" alt="">
<div>还可以输入<span id="box"></span></div>
<textarea id="text"></textarea>
<div>
<span id="bz">表情</span>
<span id="bz1">图片</span>
<span id="bz2">视频</span>
<span id="bz3">话题</span>
<span id="bz4">长微博</span>
<span id="bz5">公开</span>
<input type="button" value="发布" id="bzf">
</div>
</div>
</body>
</html>
批改老师：天蓬老师批改时间：2019-02-18 14:24:46
老师总结：试一下, 能不能将内容中的空格过滤掉, 统计 出真实的字数呢?
