textarea逐字打出

最新推荐文章于 2023-12-14 19:53:12 发布

赵才一

最新推荐文章于 2023-12-14 19:53:12 发布

阅读量388

点赞数 1

分类专栏：前端文章01 文章标签： textarea逐字打出逐字打出 textarea文字

本文链接：https://blog.csdn.net/comeonbaby110/article/details/50955998

版权

前端文章01 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

textarea逐字打出,效果图：

<span style="font-size:14px;"><textarea rows="" cols="" id="keshi_big_kuang"οnclick="stopInterval();" name="keshi_big_kuang" class="textarea" >
无需注册，立即提问，正规三甲医院专家为您解答，100%回复！
</textarea> 
<script>
  var text = "无需注册，立即提问，正规三甲医院专家为您解答，100%回复！";
  var element = document.getElementById('keshi_big_kuang');
  var count = 0;
  function type() {
    if (count <= text.length) {
      element.value = text.substring(0, count);
      count++;
    } else {
      element.value = '';
      count = 0;
    }
  }
  var intervalID = setInterval(type, 200);
  var content = element.value;
  var isTxtEmpty = 0;
  function stopInterval() {
    if (isTxtEmpty < 1) {
      element.value = content;
    }
    window.clearInterval(intervalID);
    isTxtEmpty = 1;
    element.value = '';
  }
</script></span>

textarea逐字打出