Question

在此处查看我的code：http://jsfiddle.net/qbd596tf/3/



function func(text1, text2)
{
    var text  = text1; 
    var length = text.length;
    var counter = 0; 
    var soFar = ""; 
    var i = setInterval(function() {
      if(counter == length)
         {
            if(text == text1) {
                text = text2;
                soFar = "";
                counter = 0;
                document.getElementById("div").innerHTML = "";
            }
            else {
                text = text1;
                soFar = "";
                counter = 0;
                document.getElementById("div").innerHTML = "";
            }
        }
       else {
        soFar = text.charAt(counter); 
        counter++; 
        document.getElementById("div").innerHTML += soFar; 
        }
    }, 250); 
}
func("HELLO HELLO", "WORLD"); 
<div id="div"></div>

我希望在单词结束显示时执行该操作，该功能将“休息”5秒钟然后消失该单词并显示另一个单词（此功能正常，问题在于“中断”）

我尝试使用setTimeout，但它不起作用。

有什么建议吗？

Answer 1

尝试使用此方法。我使用了setTimeout但是在clearInterval之后：

function func(text1, text2){
  var text  = text1; 
  var length = text.length;
  var counter = 0; 
  var soFar = ""; 
  var i = setInterval(showWord, 250);

  //---Function to showWord
  function showWord(){
    if(counter == length){
      if(text == text1) {
        text = text2;
        soFar = "";
        counter = 0;

        //---Clear the interval and setting a new interval
        clearInterval(i);

        setTimeout(function(){

          document.getElementById("div").innerHTML = "";

          i = setInterval(showWord, 250);

        }, 5000);
      }
      else {
        text = text1;
        soFar = "";
        counter = 0;

        document.getElementById("div").innerHTML = "";

      }
    }
    else {
      soFar = text.charAt(counter); 
      counter++; 
      document.getElementById("div").innerHTML += soFar; 
    }
  }
}
func("HELLO HELLO", "WORLD");

jsfiddle

Answer 2

您可以尝试此解决方案（JSfiddle）：

function setTimeToStartInterval(text2, text1, startIn){
    console.log(startIn)
    setTimeout(function(){
    startNewInterval(text2, text1, 50)
    }, startIn);
}

function startNewInterval(text1, text2, duration){
      var text  = text1; 
            var length = text.length;
            var counter = 0; 
            var soFar = ""; 
    var a = setInterval(function(){


            if(counter == length){
        console.log(2222)
                    if(text == text1) {
          clearInterval(a);
                        text = text2;
                        soFar = "";
                        counter = 0;
                        document.getElementById("div").innerHTML = "";
            setTimeToStartInterval(text2, text1, 5000, 'startNewInterval')
                    }
                    else {
          console.log(3333)
                        text = text1;
                        soFar = "";
                        counter = 0;
                        document.getElementById("div").innerHTML = "";
                    }
                }
            else {
        console.log(1111)
                soFar = text.charAt(counter); 
                counter++; 

                        document.getElementById("div").innerHTML += soFar; 

                }

      }, duration)
}

startNewInterval("HELLO HELLO", "WORLD", 250);

我试图使用setTimeout但它不起作用

2 个答案: