JS。某 image onload。

关于 Image 对象 onload 事件。

 

想获取的是 image 的 宽高值。所以用 onload 方法。另外是获取的远程图片。

 

但IE在第二次显示图片的时候,总是不走 onload 方法。代码:

 

var img = new Image();

img.src = "loading.gif";

img.onload = function(){

var iheight = img.height;

var iwidth  = img.width;

};

 

后来给xiaoniu同学看了后才知,img.src 应该是放在 onload 方法后边的。。

 

后来google下,才发现原来此类问题大家多有总结。。我真是外行。。

 

因为 IE 在加载缓冲区数据的时候,没有触发 onload 方法,导致该事件内代码被忽略。FF 在加载缓冲区数据的时候,顺带触发了 onload 方法。

 

所以所以。

 

 

其实还有点,就是onload的时候还要对图片进行自适应调整,就发现,需要再 onload 里还要对元素设置一次img.src。。。要不它只记得第一张图。。。

 

对这个缓存区还是一知半解。。继续。

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
将图片加载为 WebAssembly(Wasm)中可用的格式,需要使用 JavaScript 和 Wasm API。以下是一个简单的示例代码,可以将图片加载为 Wasm 中的格式: ```javascript // 创建一个 Wasm 实例 const instance = await WebAssembly.instantiateStreaming(fetch('path/to/module.wasm'), {}); // 获取 Wasm 内存实例 const memory = instance.exports.memory; // 创建一个 Image 对象 const image = new Image(); // 指定图片加载完成后的回调函数 image.onload = function() { // 获取图片数据的像素数组 const canvas = document.createElement('canvas'); canvas.width = image.width; canvas.height = image.height; const ctx = canvas.getContext('2d'); ctx.drawImage(image, 0, 0); const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height); const pixels = new Uint8ClampedArray(imageData.data.buffer); // 将像素数组复制到 Wasm 内存中 const offset = instance.exports.allocate_pixels(pixels.length); const view = new Uint8Array(memory.buffer, offset, pixels.length); view.set(pixels); // 调用 Wasm 函数处理像素数据 instance.exports.process_image(offset, canvas.width, canvas.height); // 获取处理后的像素数组并创建新的 Image 对象 const newPixels = new Uint8ClampedArray(memory.buffer, offset, pixels.length); const newImageData = new ImageData(newPixels, canvas.width, canvas.height); const newImage = new Image(); newImage.src = URL.createObjectURL(new Blob([newImageData], { type: 'image/png' })); }; // 加载图片 image.src = 'path/to/image.png'; ``` 以上代码创建了一个 Wasm 实例,获取了 Wasm 内存实例,并创建了一个 Image 对象。在 Image 对象的 onload 回调函数中,获取图片数据的像素数组,并将像素数组复制到 Wasm 内存中。然后,调用 Wasm 函数处理像素数据,并获取处理后的像素数组。最后,创建新的 Image 对象并加载处理后的像素数组。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值