Question

我试图让用户预览图像在上传图像之前与其他图像结合时的外观（想想枪射子弹）。我可以将图像加载到图像元素中，但是onload事件不会触发（在chrome和firefox中测试）。我已经尝试使用setTimeout作为脏黑客，但遗憾的是bullet.image.height似乎没有在相对较短的时间内设置。

以下是我正在尝试做的一个例子：

if (input.target.files && input.target.files[0]) {
    var file = new FileReader();

    file.onload = function (event) {
        // this part works fine
        var bullet = {};
        bullet.id = 0;
        bullet.image = new Image();
        bullet.image.onload = function () {
            // This never fires
            bullet.offset_y = bullet.image.height / 2;

            $('#modal-weapons-field-bullet').append('<option value="0">' + bullet.title + '</option>');
            $('#modal-weapons-field-bullet').val(0);
        };

        bullet.src = event.target.result;
        bullet.offset_x = 0;
        bullet.title = input.target.files[0].name;
    }

    file.readAsDataURL(input.target.files[0]);
}

Answer 1

bullet.src应为bullet.image.src

从本地文件加载时，Javascript图像onload不会触发

1 个答案: