0

我创建了一个简单的表单来上传图片。

它允许在选择后立即预览图像。

它在 Chrome 和 Firefox 中完美运行,但在 IE 中却不行,其中: - 图像预览根本不起作用;- 只有在第二次(提交)按钮单击后才能成功提交表单。

任何想法如何解决它?

您可以在http://jsfiddle.net/renatogil/qFjrE/上看到它的发生

代码是:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//PT" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<!-- Include The jQuery Library -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script>
//----------------------------------------------------
// img preview
//----------------------------------------------------
//
function readURL(input, pic) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#' + pic)
                .attr('src', e.target.result)
                .width(120)
                .height(120);
        };
        reader.readAsDataURL(input.files[0]);
    }
}
</script>
</head>
<body>

    <form method="post" action="<?php echo $_SERVER["PHP_SELF"]; ?>"
        enctype="multipart/form-data">

        <img id="product_pic" src="img/default_product_pic.jpg" width="120"
            height="120" alt="Click to upload..." /><input id="product"
            name="product" type="file"
            style="visibility: hidden; overflow: hidden; display: none;"
            onchange="readURL(this, 'product_pic');"><br> <br> <input
            id="add_pic" type="button" value="Add picture">
        </div>

        <script>$('#product_pic').click(function() { $('#product').click(); });$('#add_pic').click(function() { $('#product').click(); });</script>

        <input type="submit" value="Upload" />
        </div>
    </form>

</body>
</html>
4

1 回答 1

0

在检查您的代码后,您似乎有一个 clising 它没有在任何地方打开?

于 2013-03-02T17:05:38.167 回答