摘要:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><style>#box{width: 600px;margin:10px auto;border:8px solid pink;padding:10px
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#box{width: 600px;margin:10px auto;border:8px solid pink;padding:10px;overflow: hidden;}
.tell{float:left;}
.number{float:right;}
#content{width: 600px;display:block;margin:10px auto;clear:both;}
#sp1,#sp2,#sp3,#sp4,#sp5,#sp6{float:left;height:32px;line-height: 32px;padding-left:28px;}
#sp1{background: url(images/an5.png) no-repeat left center;}
#sp2{background: url(images/an4.png) no-repeat left center;}
#sp3{background: url(images/an3.png) no-repeat left center;}
#sp4{background: url(images/an2.png) no-repeat left center;}
#sp5{background: url(images/an1.png) no-repeat left center;float:left;}
#sp6{float:left;margin-left:120px;color:#888;font-size:13px;}
#sub{float:left;border-radius:10px;background: #ffc09f;border:none;color:#fff;text-align: center;width: 80px;height: 30px;margin-left:10px;cursor:pointer;}
</style>
<script>
window.onload=function(){
var num,content,sub;
num=document.getElementById('num');
content=document.getElementById('content');
sub=document.getElementById('sub');
content.onkeyup=function(){
var subcon=140-content.value.length;
if(subcon>=0){
num.style.color="#888";
}else{
num.style.color="red";
}
num.innerHTML=subcon;
}
sub.onclick=function(){
var subcon=140-content.value.length;
if(subcon==140){
alert('請(qǐng)輸入一點(diǎn)內(nèi)容');
content.focus();
}else if (subcon<0) {
alert('不能超過140個(gè)字符');
content.focus();
}else{
alert('發(fā)布成功');
}
}
}
</script>
</head>
<body>
<div id="box">
<img src="images/12.png" alt="">
<div>還可以輸入<span id="num"></span></div>
<textarea name="content" id="content" cols="30" rows="10" ></textarea>
<span id="sp1">表情</span>
<span id="sp2">圖片</span>
<span id="sp3">視頻</span>
<span id="sp4">話題</span>
<span id="sp5">長(zhǎng)微博</span>
<span id="sp6">公開</span>
<input type="button" value="發(fā)布" id="sub">
</div>
</body>
</html>
批改老師:韋小寶批改時(shí)間:2019-03-09 17:28:18
老師總結(jié):寫的還算是很不錯(cuò)的 等有時(shí)間可以通過jQuery來改寫一下哦 還可以把jQuery練習(xí)練習(xí)