2

我正在尝试从 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
4

2 回答 2

0

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

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;}
于 2013-09-05T10:05:33.767 回答
0

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

1
2

而没有分配图像。

  • 在主循环中,您调用 contactData.setContactImage( imgVal.src ); 以图像 src属性作为参数(图像 url);在错误循环中,您分配this.src,希望它是同一个 imgVal 对象,然后将该对象的outerHTML属性传递给 setContactImage。这是非常不同的,为了保持一致性,您应该将 this.src 作为参数传递,我找不到官方文档,但从几个示例中我发现参数应该是完整的 Image 对象。无论是哪种参数类型,都需要在两个调用中保持一致。

  • 为了让您的生活更轻松,javascript 使用闭包,即 imgVal 在 onerror 事件中仍然可用,因此您可以使用 imgVal 代替它;

  • 尝试在主循环和错误声明(或您调用函数 setContactData 的确切参数)中使用 console.log(imgVal);这应该可以解决问题;

  • onerror 不能太晚;您正在调用一个将开始自己执行的方法。可能禁止在 onerror 子句中调用它(因为你冒着无限的 onerror 循环的风险) - 这只是一个假设,我从未尝试过;但是您仍然可以在 onerror 函数中创建一个新的 Image 对象来解决这个问题。

于 2013-09-07T20:47:13.283 回答