4-6输入的时候可以实现，再删除内容时会卡在“超出1字”

来源：4-5 编程练习

慕九州2710224

2019-05-01 18:59:20

<!DOCTYPE html>
<html>
   <head>
   <meta charset="UTF-8">
   <title>输入文本</title>
</head>
<body>
<p>字数限制在30字内，<span>您还可以输入<b>30</b> 字</span></p>
<textarea cols="50"  rows="7"  id="text"></textarea>
<script type="text/javascript">
//补充代码
var text = document.getElementById("text"),
   bLen = document.getElementsByTagName("b")[0],
   span = document.getElementsByTagName("span")[0],
   tatle = 30;
   text.onkeyup = function(){
           var len = this.value.length;
           var allT = tatle-len;
       if(len<=30){
            bLen.innerHTML = allT;
       }else{
           span.innerHTML = "已超出<b>"+(len-tatle)+"</b>字";
           span.style.color = "red";
           bLen.innerHTML = len-tatle;
       }
   }
   
</script>
</body>
</html>

输入的时候可以实现，但是字数超出之后，再删除内容时会卡在"超出1字"的效果……是应该用while语句吗

写回答

3回答

好帮手慕码

2020-03-05

“qq_慕粉9137647”同学你好，是的，这里获取的b标签没有使用到，可以不获取。

祝学习愉快~

Jelolo

2022-03-20

<script>
        var text = document.getElementById("text")
        bLen = document.getElementsByTagName("b")[0]
        span = document.getElementsByTagName("span")[0]
        var tatle = 30;
        text.onkeyup = function () {
            var len = this.value.length;
            if (len <= 30) {
                span.innerHTML = "您还可以输入<b>" + (tatle - len) + "</b>字";
                span.style.color = "black";
            } else {
                span.innerHTML = "已超出<b>" + (len - tatle) + "</b>字";
                span.style.color = "red";
            }
        }
    </script>