2

これは簡単に解決できる問題だと思います。グーグルには少し注意が必要です。私はこの関数を持っており、実際の値（）に達するまで1秒間ランダムにいくつかの数値を生成しますが、これnumber()は派手な効果です。ただし、値は7桁の数値であり、カンマで区切りたいと思います。私は両方の機能のために機能する機能を持っていますが、それらを一緒に機能させる方法がわかりません。digits()関数を関数に追加しようとしましたnumber()が、数値がランダムに生成されている間は、完了した場合にのみコンマを表示できません。

これは私のnumber()コードです：

(function($){
    $.fn.extend({
        number: function(options) {
            if ( ! this.length)
                return false;

            this.defaults = {
                endAt: 90,
                numClass: 'autogen-num',
                interval: 65  // ms
            };
            var settings = $.extend({}, this.defaults, options);

            var $num = $('<span/>', {
                'class': settings.numClass
            });

            return this.each(function() {
                var $this = $(this);

                // Wrap each number in a tag.
                var frag = document.createDocumentFragment(),
                    numLen = settings.endAt.toString().length;
                for (x = 0; x < numLen; x++) {
                    var rand_num = Math.floor( Math.random() * 10 );
                    frag.appendChild( $num.clone().text(rand_num)[0] )
                }
                $this.empty().append(frag);

                var get_next_num = function(num) {
                    ++num;
                    if (num > 9) return 0;
                    return num;
                };

                // Iterate each number.
                $this.find('.' + settings.numClass).each(function() {
                    var $num = $(this),
                        num = parseInt( $num.text() );

                    var interval = setInterval( function() {
                        num = get_next_num(num);
                        $num.text(num);
                    }, settings.interval);

                    setTimeout( function() {
                        clearInterval(interval);
                    }, settings.duration * 1000 - settings.interval);
                });

                setTimeout( function() {
                    $this.text( settings.endAt.toString() );
                }, settings.duration * 1000);
            });
        }
    });
})(jQuery);

そしてこれは私のdigits()コードです：

$.fn.digits = function(){ 
    return this.each(function(){ 
        $(this).text( $(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") ); 
    })
}

前もって感謝します！

4

2 に答える 2

0

あなたはjqueryを使用していますが、そこにコールバックanyehrereを置くことができるかどうかはわかりません。関数が完了した後、コールバックがトリガーされます。

回避策としては、1秒間乱数を生成すると言っていますが、7桁であるとも言っています。いずれにせよ、あなたは彼の論理を理解するでしょう、そして確かにそれを正しくすることができます。

  1. ブール変数を作成し、2番目（1000ms）が終了するか、乱数の長さが7になると、ブールをtrueに切り替えます。
  2. コードの後半でwhileループを追加すると、ブール値がtrueに設定されるまで実行され、そこから2番目の関数がトリガーされます。

これは、これを行うための多くの方法の1つであると確信しています。それが役に立てば幸い。多分誰かがより良い暗示を持っています。Chhers！

于 2012-10-24T11:28:36.643 に答える
0

数値関数は、一度に1つの数値のみを置き換え、数値が数値であることに依存しているため、ループ中にそれらをコンマを含む文字列に置き換えることは、実際にはオプションではありません。

代わりに文字列を処理するようにnumbers関数を再構築しました。それがあなたが探しているものであるかどうかはわかりませんが、私が得ることができる最も近いものです：

(function($){
    $.fn.numAnim = function(options) {
        if (!this.length) return false;

        this.defaults = {
            endAt: 2060,
            numClass: 'autogen-num',
            duration: 1,   // seconds
            interval: 30  // ms
        };
        var settings = $.extend({}, this.defaults, options),
            $this = this,
            interval = setInterval(function() {
                var numb = parseInt(Math.random() * (Math.pow(10, settings.endAt.toString().length)));
                $this.text(numb.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
            }, settings.interval),
            timer = setTimeout(function() {
                clearInterval(interval);
                $this.text(settings.endAt.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"));
            }, 1000*settings.duration);
    }
})(jQuery);


$("#number").numAnim({
    endAt: 4103518,
    duration: 1
});​

フィドル

于 2012-10-24T12:05:00.760 に答える