0

既知の数字の 3 桁 (例: 459) を表す 3 つの div (#digit1、#digit2、#digit3) があります。実際の数値を表示する前に、各桁に0 から 9 (100 ミリ秒ごと) までの 20 個の乱数を表示したいと思います。

jQuery を使用して、次のように最初の桁を表示できます。

    function displayInterval(callback,currentnumber) {
        x = 0;
        var interval = window.setInterval(function () {

           callback();

           if (++x === 20) {
               window.clearInterval(interval);
                $("#digit1").html(currentnumber);                  
           }
        }, 100);
    }

    var number1="4";    
    var number2="5";
    var number3="9";    


    displayInterval(function () {
        var randomnumber=Math.floor(Math.random()*10);
        $("#digit1").html(randomnumber);
    },number1);

displayInterval にさらに 2 つの呼び出しを追加すると、1 桁のみで機能し、残りの 2 つは乱数を永遠に表示し続けます。

よろしくお願いします。

注:上記は、必要なものの単純化された例です。私の番号は 1 ~ 6 桁で、3 桁を超える場合はスペースを入れる必要があります (例: 12 450)。そのため、各桁を個別の div に入れる必要があります。

4

1 に答える 1

0

配列を使用して数値を格納する必要があります。3つの数字の間にギャップを置きます。

jsFiddle ライブデモ

質問で述べたように、数字ごとに div を配置する必要があります (デモをご覧ください)。

JavaScript をこれに変更し、デモの HTML コードも参照してください。

function displayInterval(callback) {
     x = 0;
     var interval = window.setInterval(function() {
           callback();
           if (++x === 20) {
               window.clearInterval(interval);

               var nums = $("div[num]");
               var max  = $("div[num]").reverse().attr('num');
               var i = max, j=1;
               $.each( nums, function( key, value ) {
                   if(j%3==0) {
                       $("div[num='"+i+"']").html("&nbsp"+$(this).attr("value"));
                   } else {
                       $("div[num='"+i+"']").html($(this).attr("value"));
                   }
                   i--;j++;
               });                 
           }
    }, 100);
}

displayInterval(function () {
    var nums = $("div[num]");
    var max  = $("div[num]").reverse().attr('num');
    var i = max, j=1;
    $.each( nums, function( key, value ) {
         var randomnumber=Math.floor(Math.random()*10)+"";
         if(j%3==0 && i != max) {
             $("div[num='"+i+"']").html("&nbsp"+randomnumber);
         } else {
             $("div[num='"+i+"']").html(randomnumber);
         }
         i--;j++;
    });  
});
于 2013-06-10T22:36:27.873 に答える