javascript - js面向对象写法中使用requestAnimationFrame报错,求高手指点
PHPz
PHPz 2017-04-11 12:04:15
[JavaScript讨论组]

js面向对象写法中使用requestAnimationFrame报错:

Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function.*/

js:

    function parcicles() {
    var w = window.innerWidth;
    var h = window.innerHeight;
    this._w = w;
    this._h = h;
    this.pSize = Math.floor(Math.random() * 4);
    this.l = Math.random() * this._w;
    this.t = Math.random() * this._h;
    var r = Math.random() * 255 >> 0,
        g = Math.random() * 255 >> 0,
        b = Math.random() * 255 >> 0,
        a = Math.floor(Math.random() * 10);
    this.lineColor = 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
}

parcicles.prototype = {
    emptyArray: [],
    length: 30,
    created: function () {
        for (var i = 0; i < this.length; i++) {
            this.emptyArray.push(new parcicles());
        }
    },
    createCanvas: function () {
        this.c = document.getElementById("c");
        this.ctx = this.c.getContext('2d');
        this.c.width = this._w;
        this.c.height = this._h;
    },
    draw: function () {
        console.log(1);
        for (var j = 0; j < this.length; j++) {
            this.ctx.beginPath();
            this.ctx.fillStyle = this.emptyArray[j].lineColor;
            this.ctx.arc(this.emptyArray[j].l, this.emptyArray[j].t, this.emptyArray[j].pSize, 0, Math.PI * 2, true);
            this.ctx.fill();
            this.ctx.closePath();
        }
    },
    move: function () {
        this.draw();
        requestAnimaFrame(this.move);
        // 上面的代码报错: Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function.,了解但是不会修改 :[
    },
    init: function () {
        this.created();
        this.createCanvas();
        this.draw();
        this.move();
    }
}
var requestAnimaFrame = function (callback) {
    return window.requestAnimationFrame(callback) ||
        window.webkitRequestAnimationFrame(callback) ||
        window.mozRequestAnimationFrame(callback) ||
        window.oRequestAnimationFrame(callback) ||
        window.msRequestAnimationFrame(callback) ||
        function (callback) {
            setInterval(callback, 1000 / 60);
        }
};

var p = new parcicles();
p.init();

html:




    
    Document
    


    sorry
    

请大神给解决下,问题知道出在哪里,就是不会改。因为传入的参数不是简单的函数名,但是面向对象的写法就要是this.draw()才能运行。求指点

PHPz
PHPz

学习是最好的投资!

全部回复(0)
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号