javascript基础微博输入作业

Original 2019-02-14 15:17:49 285
abstract:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>微博作业</title> <style> *{margin: 0;padding: 0} .clear{clear: both
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>微博作业</title>
<style>
*{margin: 0;padding: 0}
.clear{clear: both;}
a{text-decoration: none;color: black;font-size: 15px;}

.box{width: 700px;height: 168px;margin: 10px auto;border: 1px solid red;}
.top{width: 700px;height: 35px;line-height: 35px;position: relative;}
.top_left{float: left;margin-left: 8px;}
.top_left img{width: 245px;height: 30px;position: absolute;top: 5px;}
.top_right{float: right;margin-right: 8px;}
.content{width: 700px;height: 75px;}
.content textarea{width: 680px;height: 75px;margin: 0 auto;display: block;border: 1px solid black;}
.down{width: 700px;height: 52px; line-height: 52px;}
.down_left{float: left;margin-right: 8px;}
.down_left span{padding-left: 23px;}
.down_right{float: right;margin-left: 18px;}
.down_right input{width: 88px;height: 32px;border: none;background: orange;margin-right: 8px;border-radius: 5px;font-size: 15px;}
#d1{background: url(image/2.png)no-repeat left center;}
#d2{background: url(image/3.png)no-repeat left center;}
#d3{background: url(image/4.png)no-repeat left center;}
#d4{background: url(image/5.png)no-repeat left center;}
#d5{background: url(image/6.png)no-repeat left center;}
#d6{background: url(image/7.png)no-repeat left center;}

</style>

<script type="text/javascript">
var text,number,m
window.onload=function(){
text=document.getElementById('text')
number=document.getElementById('number')
bt=document.getElementById('bt')
text.onkeyup=function aa(){
m=140-text.value.length
if(m<0) {
number.style.color="red"
}else{
number.style.color="#888"
}
number.innerHTML=m
}
bt.onclick=function(){
if(m==140) {
alert("你还没有输入")
text.focus()
}else if (m<0) {
alert("字数太多,不可以发布")
text.focus()
}else{
alert("发布成功")
}
}
aa()
}

</script>
</head>
<body>
<div>
<div>
<div>
<img src="image/1.png" alt="有什么新鲜事想告诉大家?">
</div>
<div>
<div>还可以输入<span id="number"></span>字</div>
</div>

</div><div></div>
<div>
<textarea  id="text" ></textarea>
</div>
<div>
<div>
<span id="d1"><a href="#">表情</a></span>
<span id="d2"><a href="#">图片</a></span>
<span id="d3"><a href="#">视频</a></span>
<span id="d4"><a href="#">话题</a></span>
<span id="d5"><a href="#">头条文章</a></span>
<span id="d6"><a href="#">···</a></span>
</div>
<div>
<span id="d7"><a href="#">公开</a></span>
<input type="button" value="发布" id="bt">
</div>
</div>
</div>
</body>
</html>


Correcting teacher:灭绝师太Correction time:2019-02-14 15:29:29
Teacher's summary:老师的源码中有个bug,aa()这个函数可以去掉,虽然有效果也可以实现,但是你没有发现有个报错么,找找原因

Release Notes

Popular Entries