2016-12-04 3 views
0

個々の文字に分割された指定された文字列をループしてテロップテープスタイルに戻そうとしています。私はワードカウンタをインクリメントする予定のsetIntervalの中に関数を持っていますが、カウンタ(整数)を関数に参照で送ることができないので、これを動作させるのが難しいです。私はこのサイトのさまざまなページを読んできましたが、値渡しと参照渡しについてのパスについては他のものを読んでいますが、まだそれを動作させることはできません。誰も助けることができますか?私の最新の化身は以下の通りです - そしてそれは動作しません:(javascriptの関数への参照を渡して配列をループする

<!DOCTYPE html> 
<html> 
<body> 

<span id="demo"></span> 

<script> 
myFunction(); 

function myFunction() 
{ 
    var str = "How are you/doing today?"; 
    var res = str.split(""); // we now have an array of individual letters 
    // The "/" is intended to be a line break 

    var counter = { value: 0 }; // keeps track of where we are 

    myvar = setInterval(appendText, 250, res, counter); // Run every 250ms 
    if(counter.value > res.length) clearInterval(myVar); // when we read the end of the character array, stop the read out. 
} 

function appendText(res, c) 
{ 
    var addtext; 
    if (res[c.value] =="/") 
    { 
     addtext="<br/>"; 
    } 
    else 
    { 
     addtext = res[c.value]; 
    } 
    document.getElementById("demo").innerHTML+=addtext; 
    c.value++; // c is a counter that keeps track of where we are in the text string 
} 
</script> 

</body> 
</html> 
+4

'C'がオブジェクトである場合には、何がis'res [C] 'にアクセスすることになって?あなたは 'res [c.value]'と書いていましたか? – UnholySheep

+3

'counter.value'ではなく' res.length'と 'counter'を比較しています。 – CollinD

+0

ああ、これらのコメントをいただきありがとうございます。私はそれに応じてコードを調整しました。文字配列の最後を過ぎて出力されていますが、もっとうまくいきます。 – user3713442

答えて

1

@UnholySheepによるとuser3713422 @コメントに続いて、そしてmyFunctionmyvar外スコープの宣言を含め、未定義のmyVar

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 

 
    <span id="demo"></span> 
 

 
    <script> 
 
    myFunction(); 
 
    var myvar; 
 

 
    function myFunction() { 
 
     var str = "How are you/doing today?"; 
 
     var res = str.split(""); // we now have an array of individual letters 
 
     // The "/" is intended to be a line break 
 

 
     var counter = { 
 
     value: 0 
 
     }; // keeps track of where we are 
 

 
     myvar = setInterval(appendText, 250, res, counter); // Run every 250ms 
 

 
    } 
 

 
    function appendText(res, c) { 
 
     var addtext; 
 

 
     if (res[c.value] == "/") { 
 
     addtext = "<br/>"; 
 
     } else { 
 
     addtext = res[c.value]; 
 
     } 
 

 
     document.getElementById("demo").innerHTML += addtext; 
 
     c.value++; // c is a counter that keeps track of where we are in the text string 
 
     // when we read the end of the character array, stop the read out. 
 
     console.log(c.value, res.length); 
 
     if (c.value === res.length) clearInterval(myvar); 
 
    } 
 
    </script> 
 

 
</body> 
 

 
</html>
への参照を削除しますそれはあまりにも、な長さのプロパティを持っている。そして、文字に簡単にアクセスウィットあるbecaus

0

あなたは、直接文字列を使用することができますhはインデックスです。

function myFunction() { 
 
    var res = "How are you/doing today?", 
 
     counter = { value: 0 }; 
 

 
    myInterval = setInterval(appendText, 250, res, counter); 
 
} 
 

 
function appendText(res, c) { 
 
    document.getElementById("demo").innerHTML += res[c.value] == "/" ? "<br/>" : res[c.value]; 
 
    c.value++; 
 
    if (c.value === res.length) clearInterval(myInterval); 
 
} 
 

 
var myVar; 
 
myFunction();
<span id="demo"></span>

関連する問題