摘要:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js控制字数限制</title> <style type="text/css"> body{ fo
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js控制字数限制</title> <style type="text/css"> body{ font-size: 12px; } .box{ width: 600px; height: 160px; border: 10px solid pink; margin: 0px auto; padding: 10px; } img{ float: left; } .box1{ float: right; width: 150px; height: 24px; text-align: right; font-size: 14px; color: #888; } .box1 span{ font-size: 16px; font-weight: bold; } #text{ width: 600px; height: 100px; border: 1px solid #888; margin-top: 5px; } .box #sp1,#sp2,#sp3,#sp4,#sp5,#sp6{ float: left; width: 30px; height: 32px; line-height: 32px; padding-left: 26px; } #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; width: 40px; } #sp6{ margin-left: 150px; margin-right: 15px; color: #888; } #bt{ float: left; width: 80px; height: 30px; border: none; background: #ffc09f; color: #fff; border-radius: 5px; } </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) { window.alert("您还没有输入!"); text.focus(); } else if(m<0){ window.alert("字数过多,无法发布"); text.focus(); } else{ window.alert("发布成功"); } } aa(); } </script> </head> <body> <div class="box"> <img src="images/12.png"/> <div class="box1">还可以输入<span id="number">140</span>字</div> <textarea id="text"></textarea> <span id="sp1">表情</span> <span id="sp2">图片</span> <span id="sp3">视频</span> <span id="sp4">话题</span> <span id="sp5">长微博</span> <span id="sp6">公开</span> <input type="button" value="发布" id="bt"/> </div> </body> </html>
问题:下面这段代码加下划线这段,我这边测试的m==140这边给报的是发布成功。m=140,您还没有输入。
bt.onclick=function() {
if (m==140) {
window.alert("您还没有输入!");
text.focus();
} else if(m<0){
window.alert("字数过多,无法发布");
text.focus();
} else{
window.alert("发布成功");
}
}
我的页面中将代码修改成如下,其余代码与课题一致
<div class="box1">还可以输入<span id="number">140</span>字</div>
批改老师:韦小宝批改时间:2018-12-05 09:23:32
老师总结:你先要了解一个等于就是赋值,m=140,就是讲140赋值给m这个肯定是可以的!而两个等于是比较,比较m是否等于140