lufy's legend

标题: FileReader读取图片显示的问题? [打印本页]

作者: ccalm 时间: 2014-8-14 15:41
标题: FileReader读取图片显示的问题?

代码的用途是让用户选择一张图片，然后在canvas上显示出来

测试环境：safari,iphone

问题1:当点击“打开图片”按钮后，弹出文件浏览菜单，用户选择好后，回到界面内，此时点击“刷新”后触发的却是“打开图片”的事件。
问题2:用户选择好图片加载完后，图片没有正常显示，而用户再一次点击“打开图片”加载前面那张图片后，才会正常显示，也就是加载2次。
   （问题2在PC CHROME上没有重现，只有在Safari上会重现）

【index.html】
//用一个file来让用户选择图片,图片选择好后会触发getPhoto函数
<input type="file" capture="camera" accept="image/*" id="cameraInput" name="cameraInput" class="sign_file"  style="display:none" />

【main.js】
function main()
{
//...初始化省略

//增加2个按钮

var btn1 = addButton(0,"刷新",100,80,0,200);//这个按钮用来重现问题1的BUG
btn1.addEventListener(LMouseEvent.MOUSE_UP, btnRefresh);

var btn2 = addButton(0,"打开图片",100,80,0,200);//增加一个按钮，用来让用户点击触发打开图片
btn2.addEventListener(LMouseEvent.MOUSE_UP, btnOpenPhotoOk);
}
function btnRefresh(e)
{
}

//点击打开图片后
function btnOpenPhotoOk(e)
{
var aa = document.getElementById("cameraInput");
aa.click();
}

//选择图片确认后
function getPhoto(val)
{
var file = val.files[0];
if(window.FileReader)
{
var fr = new FileReader();
fr.onloadend = function(e)
{
var img = new Image();
img.src =e.target.result;
bbt = new LBitmap(new LBitmapData( img ) );
mapLayer.addChildAt(b,0);
//console.log("加载成功");
};
fr.readAsDataURL(file);
}
}

作者: lufy 时间: 2014-8-14 15:52
LBitmapData中传入的数据是读取完的Image，
API中有用法，你要么自己onload，要么就应该使用LLoader

欢迎光临 lufy's legend (http://lufylegend.com/forum/)