当 phonegap 中不存在图像时，用联系人照片替换默认图像答案

【问题标题】：replace default image with contact photo when image doesn't exist in phonegap当 phonegap 中不存在图像时，用联系人照片替换默认图像
【发布时间】：2013-08-27 15:13:19
【问题描述】：

我正在尝试从 phonegap for android 获取联系人数据，在这里我正在尝试获取联系人图片并尝试在实际联系人照片不存在时将其替换为默认图片。

现在在 phonegap 中，当我们尝试访问照片时，即使照片不存在，它也会返回 url。所以我在这里尝试创建Image 对象并分配从phonegap 获取的照片url，如果图像不存在，Image 对象将引发onerror 异常并且在其中我正在将其src 属性更改为默认图像.

但现在的问题是 onerror 函数触发较晚，我的意思是在数据加载之后，所以 src 属性没有改变。所以谁能告诉我如何管理onerror

   if(contacts[i].photos){  
                        for(k =0 ;k < contacts[i].photos.length;k++){



                            var imgVal = new Image();
                            imgVal.onerror = function(){


                          this.src= 'resources/images/default_usr.png';
                          this.error = null;

                                contactData.setContactImage(this.outerHTML);
                                console.log("2");
                            }
                            imgVal.width="45";
                            imgVal.height="45";
                            imgVal.src = contacts[i].photos[k].value;

                            contactData.setContactImage(imgVal.src);


                            console.log("1");       

                        }//end for contact photo
                    }// end if contact photo

【问题讨论】：

标签： cordova

【解决方案1】：

给它一个默认的背景图片，即联系人照片。而不是让它加载照片，如果真实照片存在，它会加载它。

html代码是：

<img src="Path/to/image" id="img"/>

css 会是这样的：

#img{background: url(path/to/default/image) no-repeat scroll 0 0 transparent; backgorund-size:100% 100%; height:45px; width:45px; display:block;}

【讨论】：

我正在动态添加img标签
你应该在 jquery 中使用“live”函数
m 使用 snecha touch 不是 jquery

【解决方案2】：

您没有展示如何创建contactData，我自己也没有这样做，但这里有几个阅读您的代码的注意事项，假设当前您的调试控制台显示

1
2

虽然没有分配图像。

在主循环中，您调用 contactData.setContactImage(imgVal.src);以 image src 属性作为参数（图片 url）；在错误循环中，您分配 this.src，希望它是同一个 imgVal 对象，然后将该对象的 outerHTML 属性传递给 setContactImage。这是非常不同的，为了保持一致性，您应该将 this.src 作为参数传递，我找不到官方文档，但从几个示例中我发现参数应该是完整的 Image 对象。无论是哪种参数类型，都需要在两次调用中保持一致。
为了让您的生活更轻松，javascript 使用闭包，即 imgVal 在 onerror 事件中仍然可用，因此您可以使用 imgVal 代替它；
尝试在主循环和错误声明（或调用 setContactData 函数的确切参数）中使用 console.log(imgVal)；这应该可以解决问题；
onerror 不能太晚；您正在调用一个将开始自己执行的方法。可能禁止在 onerror 子句中调用它（因为您冒着无限的 onerror 循环的风险） - 这只是一个假设，我从未尝试过；但您仍然可以在 onerror 函数中创建一个新的 Image 对象来解决这个问题。

【讨论】：