1

アニメーションで文字列ランダマイザーを作成しようとしていますが、機能しません。

この関数を使用して、ブラウザーが選択したフレームレートに従って関数を呼び出します。

window.requestAnimFrame = (function(){
  return  window.requestAnimationFrame       || 
          window.webkitRequestAnimationFrame || 
          window.mozRequestAnimationFrame    || 
          window.oRequestAnimationFrame      || 
          window.msRequestAnimationFrame     || 
          function( callback,  element){
            window.setTimeout(callback, 1000 / 60);
          };
})();

文字列を生成して表示するための私の方法としてこれが続きます：

function create(chars,string_length){
output = [];
var randomstring = '';
    for (var i=0; i<string_length; i++) {
        var rnum = Math.floor(Math.random() * chars.length);
        randomstring += chars.substring(rnum,rnum+1);
    }


    output.push(randomstring);

    document.getElementById('cb').innerHTML = (output.join(''));
}


var chars =  "ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
var length = 20;

requestAnimFrame( create(chars,length) );

それは私のdiv'id'への文字列を生成しますが、一度だけです-したがって、関数は機能していますが、常に呼び出されているわけではありません= /

なぜこれでしょうか？

4

1 に答える 1

3

requestAnimationFrameを使用している場合、関数は1回だけ実行されます。create()それ自体でrequestAnimationFrameを再度呼び出すように変更する必要があります。また、別の間違いを犯してcreate()います。関数をrequestAnimationFrameに渡す代わりに、実際に呼び出しcreate(chars, length)て結果をrequestAnimationFrameに渡します。動作するはずのバージョンは次のとおりです。

function create(chars,string_length){
    output = [];
    var randomstring = '';
    for (var i=0; i<string_length; i++) {
        var rnum = Math.floor(Math.random() * chars.length);
        randomstring += chars.substring(rnum,rnum+1);
    }


    output.push(randomstring);

    document.getElementById('cb').innerHTML = (output.join(''));

    requestAnimFrame(function(){ create(chars,string_length); });
}


var chars =  "ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
var length = 20;

requestAnimFrame(function(){ create(chars,length) });
于 2012-05-29T02:35:00.113 に答える