在上传之前在页面上预览图像适用于除IE之外的所有浏览器

时间:2012-04-06 19:13:25

标签: javascript html

我有一个javascript函数,会在点击提交之前显示您要上传的图片。它只是在您选择文件时显示页面上的图像。这适用于所有浏览器,但IE。这是一个非常简单的javascript函数。任何想法为什么这不会在IE中呈现?谢谢。

这是页面顶部的Javascript:

             

    function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#blah')
                    .attr('src', e.target.result)
                    .width(75)
                    .height(75);
            };

            reader.readAsDataURL(input.files[0]);
        }
    }

这是空图像的HTML。选择文件后,它将显示在img id =“blah”中。这在所有浏览器中都能正常呈现,但IE。

<div id="question_submit_outside_holder">
    <input type="submit" name="question_reply_upload_image" id="questions_place_inline_image_form_submit_one" value="Place image" />
</div>

<div id="questions_form_image_upload_image_holder">
    <img id="blah" src="" /> <!-- img should be displayed here -->
</div>

更新

这是我将图片附加到帖子的方式。它显示在所有浏览器中,但IE

<script type="text/javascript">
    image = '<img src="http://forum.site.com/.../<?php echo $_SESSION['user_id']; ?>/question_reply_images/<?php echo $image_name; ?>" alt="<?php echo $alt; ?>" />';
    document.getElementById('editor1').innerHTML += image;
    window.location = '#reply_textbox';
</script>

1 个答案:

答案 0 :(得分:2)

当然它在IE中不起作用! IE9及更低版本不支持FileReader API,它可以在您发布的代码中启用缩略图预览。

好消息:IE10确实支持FileReader API。 http://caniuse.com/filereader