javascript - Canvas 无法在 Firefox 上加载

Question

这个函数有什么问题吗？

window.LoadImage = function(el, canvasId){
            var canvas = document.getElementById(canvasId);
            var context = canvas.getContext("2d");
            var dialogCanvas = document.getElementsByClassName('dialogCanvas');
            var dialogContext = dialogCanvas[0].getContext("2d");
            var reader = new FileReader();
            reader.onload = function(event){
                var img = new Image();
                img.onload = function(){
                    var w = 545;
                    var imgW = img.width;
                    var imgH = img.height;
                    var dialogW = dialogCanvas[0].width;
                    var dialogH = dialogCanvas[0].height;

                    h = (imgH / imgW) * w;
                    dialogH = (imgH / imgW) * dialogW;  

                    context.clearRect(0, 0, w, imgH);
                    dialogContext.clearRect(0,0, dialogW, 250);
                    canvas.width = w;
                    canvas. height = h;
                    context.drawImage(img,0,0,w,h);
                    dialogContext.drawImage(img,0,0,dialogW, dialogH);

                }
            img.src = event.target.result;

            }
            reader.readAsDataURL(event.target.files[0]); 
        }

我正在尝试使用此函数绘制 2 个不同的 Canvas 。两者都不适用于 Firefox。而且这该死的东西可以在 Chrome 和 IE 上运行。

“dialogCanvas”是一个预览，位于 jquery 模式框内，另一个使用“canvasId”参数访问，其值为 display = "none" ，在页面中。

我在 Firefox 上没有收到任何错误。事实上，我什至无法调试它。

提前致谢。

编辑 jsfiddle = http://jsfiddle.net/cgEv8/

Answer 1

这一行:

        reader.readAsDataURL(event.target.files[0]); 

指的是“事件”。那是哪里？在某些浏览器中它是一个全局对象，但在 Firefox 中不是。