我是一个真正的 JavaScript 或 jQuery 文盲，只是想对以前创建的功能进行故障排除。这在 Firefox 上有效但在 Chrome 上失败。我导入图像然后裁剪所需的数据但有时图像不清晰并且非常小所以我需要提供缩放功能，然后因为缩放集中在中心图像的我需要提供一个移动选项来左右移动图像，单独使用 img 标签可以移动和缩放所以我使用它并且它在 firefox 上运行良好没有任何错误，但图像根本不显示在 chrome 中，下面是与导入图像和创建它的 Canvas 相关的代码块。以前的开发人员曾使用 div 标签创建 Canvas ，但缩放和移动对我来说在 div 标签上不起作用。 请询问是否需要其他详细信息。
$("#movingImage").empty();
//$("#movingImage").attr("src", image.src);
$("#movingImage").append("<canvas id=\"canvas\">");
canvas = $("#canvas")[0];
context = canvas.getContext("2d");
canvas.width = image.width;
canvas.height = image.height;
context.drawImage(image, 0, 0);
HTML如下:
<div id="views" >
<img src="" id="movingImage" alt="" />
</div>
最佳答案
append() 方法将给定元素作为目标的子元素插入。然而 img 标签不能有子标签。也许试试 after相反？
出于同样的原因，不确定empty()方法在这里是否有效...
您也可以尝试 replaceWith()用创建的 Canvas 替换 img 节点的方法
关于javascript - 图像导入在 Chrome 中不起作用，但在 Firefox 中有效，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45140214/