分享
三行代码  ›  专栏  ›  技术社区  ›  Tim B. McKinnon

第二行后如何停止打字效果?

  •  0
  • Tim B. McKinnon  · 技术社区  · 1 周前

    任何人,请帮帮我,我现在需要修好它。

    var _CONTENT = [ "First line.", "Second Line." ];
    var _PART = 0;
    var _PART_INDEX = 0;
    var _INTERVAL_VAL;
    var _ELEMENT = document.querySelector("#text");
    function Type() { 
        var text =  _CONTENT[_PART].substring(0, _PART_INDEX + 1);
        _ELEMENT.innerHTML = text;
        _PART_INDEX++;
        if(text === _CONTENT[_PART]) {
            clearInterval(_INTERVAL_VAL);
            setTimeout(function() {
                _INTERVAL_VAL = setInterval(Delete, 50);
            }, 1000);
    
        }
    }
    function Delete() {
        var text =  _CONTENT[_PART].substring(0, _PART_INDEX - 1);
        _ELEMENT.innerHTML = text;
        _PART_INDEX--;
        if(text === '') {
            clearInterval(_INTERVAL_VAL);
            if(_PART == (_CONTENT.length - 1))
                _PART = 0;
            else
                _PART++;
            _PART_INDEX = 0;
            setTimeout(function() {
                _INTERVAL_VAL = setInterval(Type, 100);
            }, 200);
    clearInterval(_CONTENT);
    
        }
    }
    _INTERVAL_VAL = setInterval(Type, 100);
    <div id="hello-content">
        <h1><div id="text"></div></h1>
    </div>
    2 回复  |  直到 1 周前
        1
  •  0
  •   Asutosh    1 周前

    var _CONTENT = [ "First line.", "Second Line." ];
    var _PART = 0;
    var _PART_INDEX = 0;
    var _INTERVAL_VAL;
    var _ELEMENT = document.querySelector("#text");
    function Type() { 
        var text =  _CONTENT[_PART].substring(0, _PART_INDEX + 1);
      
       
        _ELEMENT.innerHTML = text;
        _PART_INDEX++;
         if(text==="Second Line."){
    
          clearInterval(_INTERVAL_VAL);
        }
        else if(text === _CONTENT[_PART] ) {
            clearInterval(_INTERVAL_VAL);
            setTimeout(function() {
                _INTERVAL_VAL = setInterval(Delete, 50);
            }, 1000);
    
        }
    }
    function Delete() {
        var text =  _CONTENT[_PART].substring(0, _PART_INDEX - 1);
        _ELEMENT.innerHTML = text;
        _PART_INDEX--;
        if(text === '') {
            clearInterval(_INTERVAL_VAL);
            if(_PART == (_CONTENT.length - 1))
                _PART = 0;
            else
                _PART++;
            _PART_INDEX = 0;
            setTimeout(function() {
                _INTERVAL_VAL = setInterval(Type, 100);
            }, 200);
    clearInterval(_CONTENT);
    
        }
    }
    _INTERVAL_VAL = setInterval(Type, 100);
    <div id="hello-content">
        <h1><div id="text"></div></h1>
    </div>