图像,onload 事件在 Chrome 中不起作用

2024-02-11

我正在使用 html5 创建拖放图像上传功能。这在 Firefox 中对我来说非常有用,但在 chrome 中图像 onload 事件仅在第一次触发。如果我只在第一个作品中拖动多个图像,而如果我在其中拖动第二个图像,则会失败。我相信问题出在图像加载上。

这是我的代码的工作方式,我删除了不相关的部分:

            var img = document.createElement("img");
            var reader = new FileReader();
            var canvas = document.createElement("canvas");
            var canvasData;
            var ctx = canvas.getContext("2d");
            var myFiles;
            var i = 0; 


                 reader.onload = (function (aImg)
                    { 
                        return function (e)
                        {
                            aImg.src = e.target.result;
                        };
                    })(img);

        img.onload = function (){

        //resizes image 
        //draws it to the canvas
        //posts to server

        i++;
        if(i < myFiles.length){
        processNext(i);
                            }
        }



    function processNext(filei) {

         var file = myFiles[filei];

            img.file = file;

            reader.readAsDataURL(file);


        }

i = 0;
myFiles = files;
processNext(0);

有谁知道为什么这在 Firefox 中有效但在 Chrome 中无效?


铬追踪器的解释:

这不是一个错误。 WebKit 只是更加严格。您必须在替换之前实例化一个新的 Image() 对象,如下所示:

var photo = document.getElementById('image_id');
var img = new Image();
img.addEventListener('load', myFunction, false);
img.src = 'http://newimgsource.jpg';
photo.src = img.src;

source: http://code.google.com/p/chromium/issues/detail?id=7731#c12 http://code.google.com/p/chromium/issues/detail?id=7731#c12

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

图像,onload 事件在 Chrome 中不起作用 的相关文章

随机推荐

  • CSS 在某个点改变背景颜色

    我希望当某个元素进入视图时整个网站的背景从白色变为黑色 因此 当您滚动元素时 背景会变为黑色 当您向后滚动时 我希望页面的背景颜色变回白色 谢谢你 HTML div class colorChange div
  • Google Places API - getQueryPredictions 受国家/城市/州限制吗?

    下面是 google 给出的 getQueryPredictions 示例 service getQueryPredictions input pizza near callback 有没有办法限制特定国家 城市 州的结果 其他功能 组件有
  • .NET 写入 PCAP 文件

    All 我花了一天的大部分时间查看各种 PCAP 库 在我承诺编写 PCAP 编写器之前 我想描述一下我的场景并征求意见 我有一个客户要求我提供一项服务来读取 pcap 文件并将数据包写入他们选择的数据库中 然后 客户端可以查询数据库 日期
  • 从多选ListView返回值

    编辑 好的 我找到了解决方案 不知道这是正确的解决方案 但它确实可以正常工作 添加到下面的代码中 我试图允许用户从清单中选择多个目录 并在单击 提交 按钮后返回它们 这是我的代码片段 它使用 sdcard 上的所有目录填充 ListView
  • 通过特定属性的值在数组中搜索对象的最有效方法

    实现搜索方法的最快 最有效的方法是什么 该方法将返回具有限定条件的对象id 示例对象数组 array object id gt one color gt white object id gt two color gt red object
  • 在字符串中每两个字符后插入冒号(:) 的方法是什么?

    我试图弄清楚 INPUT String data 506313B5EA3E OUTPUT String data 50 63 13 B5 EA 3E 我尝试使用 java util Arrays toString data split lt
  • 无法打开文件(在项目“Pods”的目标“React”中)(在目标“React”中)

    我有一个reactNative项目 我正在尝试在最新的xcode 10 1中运行 但是在我构建时它抛出了两个错误 error Users ios Pods Target Support Files React React xcconfig
  • 在 Eclipse 中调试 JavaScript

    如何在 Eclipse 中调试 JavaScript 我使用的是 Eclipse 3 2 1 每次我单击侧面时 它都会提供添加书签的选项 但没有断点 有人可以帮助我吗 2015年 在Eclipse中调试JavaScript至少有六种选择 自
  • Apache Kafka 和 Avro:org.apache.avro.generic.GenericData$Record 无法转换为 com.harmeetsingh13.java.Customer

    每当我尝试从 kafka 队列读取消息时 我都会收到以下异常 error run main 0 java lang ClassCastException org apache avro generic GenericData Record
  • if else 不检查 Python 中的两个条件

    我希望根据特定条件创建新列 pred n 条件如下 如果年份小于或等于当前年份且月份小于当前月份 则 pred n 应等于 yhatpct 否则应为yhatpct ft 尝试以下语法 if dfyz year x lt datetime n
  • FCM 服务不可用 nack

    我有一个 python3 程序 可以成功连接到 FCM XMPP 测试服务器 但是 发送 JSON 后 它返回给我一个SERVICE UNAVAILABLE每次nack消息 上周的同一段代码运行得非常好 The 文档 https fireb
  • Django 模型管理器.py 和 models.py

    鉴于以下情况 模型 py from managers import PersonManager from django db import models class Person models Model first name models
  • 电对模式和 Python 三引号

    有没有办法在电对模式下启用自动配对Python三引号 这可以在自动配对模式下使用进行配置autopair python triple quote action 是否有类似的方法可以在电对模式下启用此功能 您可以执行以下操作 defun py
  • Rails 在开发模式下不会记录模板错误

    我的 Rails 3 2 9 app 没有向我显示任何有关错误的具体错误信息在模板中 无论我使用 haml 还是 erb 我总是会得到 我们很抱歉 但有些不对劲 事实上 韦布里克is in 发展模式 如果我的模型或控制器出现错误 我会看到完
  • 如何在 GDAL ruby​​ 绑定中显式关闭数据集?

    我在用GDAL https gdal org 1 7 1 从ruby1 9生成GeoTIFF文件 在里面tutorial https gdal org tutorials raster api tut html他们建议使用 GDALClos
  • Ubuntu 11.10链接perftools库

    我无法让 Ubuntu 11 10 中的 gcc 正确链接到 google perftools lprofiler 问题似乎是链接器丢弃了程序中未直接使用的库 一个例子会有所帮助 我们称之为 main cpp include
  • Xamarin iOS UIButton 如何以编程方式单击按钮?

    我试图通过在 ViewWillAppear 函数中以编程方式调用按钮来伪造单击按钮的行为 onclick 函数是在我的 ViewDidLoad 中定义的 您可以看到我正在尝试使用执行选择器来手动调用按钮 该按钮似乎没有运行 有任何想法吗 p
  • WebRTC:对多个对等连接使用相同的 SDP?

    是否可以在多个对等连接中使用相同的 SDP 我正在使用 WebRTC 构建视频会议 这个想法是 呼叫者使用某种信令机制 使用其 SDP 每个用户相同的 SDP 向所有其他用户发送广播消息 然后用户将使用其 SDP 进行响应 当用户收到某人的
  • 调整窗口大小时是否可以完全消除闪烁?

    通常 即使使用双缓冲 在调整窗口大小时 似乎也不可避免地会发生闪烁 第1步 原始窗口 第2步 调整窗口大小 但多余的区域尚未绘制 第3步 调整窗口大小 并绘制额外区域 是否有可能以某种方式隐藏步骤 2 我可以暂停调整大小过程 直到绘画操作完
  • 图像,onload 事件在 Chrome 中不起作用

    我正在使用 html5 创建拖放图像上传功能 这在 Firefox 中对我来说非常有用 但在 chrome 中图像 onload 事件仅在第一次触发 如果我只在第一个作品中拖动多个图像 而如果我在其中拖动第二个图像 则会失败 我相信问题出在