更改对象的图像答案

【问题标题】：Change image of an object更改对象的图像
【发布时间】：2014-05-18 02:09:59
【问题描述】：

我想这样当我运行一个函数时，它会改变函数中对象的图像，我认为这会起作用

for(var i = 0; i < heads.length; i++){heads[i].src = ram_head;}

ram_head 等于带有 url 的字符串，但是当我运行代码时，图像在我运行函数时根本没有改变。

代码示例：http://jsfiddle.net/themagicalcake/URvA7

【问题讨论】：

heads 和 ram_head 是什么？您必须向我们展示更多代码，以便我们知道发生了什么。将 <image> 标记上的 .src 属性更改为正确的图像 URL 将更改显示的图像。
heads 是一个包含具有图像属性的对象的数组，我说什么是 ram head
抱歉，我不知道“带有图像属性的对象的数组”是什么。如果您真的想在这里获得帮助，您将向我们展示其余的相关代码，而不是让我们问 20 个问题来试图找出如何帮助您。现在你有一个不完整的问题，它只披露了大约 30% 的可能想要帮助的人需要知道的内容。
function head() { this.img = new Image(); this.img.src = "~link~"; }
jsfiddle.net/themagicalcake/URvA7 这是一个展示我的问题的小提琴

标签： html canvas html5-canvas

【解决方案1】：

代码如下：

创建一个图像对象（头部）数组
将相同的图像 URL 分配给所有这些图像对象 (rams_head)
当每个图像完全加载后，将该图像绘制到画布上。

示例代码和演示：http://jsfiddle.net/m1erickson/5DXe7/

var ram_head="https://dl.dropboxusercontent.com/u/139992952/multple/RAMDISEGNO.jpg";

var heads=[];
heads.push(new Image());
heads.push(new Image());

for(var i=0;i<heads.length;i++){

    heads[i].onload=function(){
        ctx.drawImage(this,this.x,10);
    }

    heads[i].x=i*100;

    heads[i].src=ram_head;

}

【讨论】：

我想你误解了我的问题。我的数组中已经有对象，我想更改所有对象的图像，但它不起作用
这正是 for 循环在我的回答中所做的！它需要一个图像对象数组并将所有图像更改为在 ram_head 中获取的图像。我还在画布上绘制图像作为“概念验证”，但如果您的设计不需要它，您不必这样做。我提供了示例代码，因为您在问题中显示的代码应该可以工作。如果没有，那么问题就出在您提供的代码之外——这就是 jfriend00 向您请求更多代码的原因：-/
所以你说for(var i = 0; i < heads.length; i++){heads[i].src=ram_head;} 会起作用，因为这就是我所拥有的。
是的，它会起作用的......请参阅我的工作演示。再说一次（！），如果这对您不起作用，那么您的代码的问题超出了您提供给我们的一小段代码。
我无法调试您拒绝展示的代码...祝您项目顺利。

【解决方案2】：

我发现您现在链接到的代码存在三个问题：

当您设置 Image 对象的 .src 时，在新的 .src URL 图像加载之前，您无法使用该图像进行绘制。如果您想更改.src 然后进行绘制，则必须处理 onload 事件并在触发时进行绘制。
在您的onkeydown 处理程序中，您正在设置heads[i].src，但图像对象是heads[i].img，因此图像的.src 将是heads[i].img.src。

.src

【讨论】：

我无法理解您所说的第一点。而且我忘记在我链接的代码中包含setInterval 代码。
我也刚刚意识到，如果我要向数组中添加更多对象，他们将没有新图像。如何更改构造函数.img.src？
@user3236691 - 抱歉，如果不了解您要解决的整体问题，我真的无法进一步帮助您。您当前的代码对我来说毫无意义，因为您也可以将 <img> 插入到 DOM 中，而不是为您正在做的事情手动绘制它，我认为没有理由拥有 head 对象，因为您可以只是在<img> 对象上放置一个标识符。因此，在不了解您实际尝试做什么的情况下，我不知道要推荐什么代码，并且我不想在没有我了解的目标的情况下进一步构建。