使用裁剪的画布图像画布空错误更改 dropzone 缩略图

Posted 2023-02-25

【中文标题】使用裁剪的画布图像画布空错误更改 dropzone 缩略图

【英文标题】：Change dropzone thumbnail with cropped canvas image canvas null error

【发布时间】：2016-12-20 11:42:56

【问题描述】：

我想用画布裁剪图像并在成功后更改 dropzone 缩略图我正在使用此代码：

success: function (file,responseText) 
            $('#dzImageHidden').val(responseText);
            if (responseText) 
                var imageUrl =' asset('uploads/dz/') ' + '/' + responseText;
                var img = $('<img id="target">'); 
                img.attr('src', imageUrl);


                var image = new Image(); 
                var canvas = document.getElementById('img');
                var ctx = canvas.getContext('2d');
                image.src = imageUrl; 

                file.previewElement.querySelector("[data-dz-thumbnail]").src = ctx.drawImage(image, 0, 0, 100, 165);
            

我收到了这个错误：

类型错误：画布为空

【参考方案1】：

可能因为这个原因为空：var canvas = document.getElementById('img');

您选择了标签 img，而不是 id。