Jquery 在Internet Explorer中，图像上载预览不起作用，表单仅在第二次单击后提交_Jquery_Internet Explorer_Submit

Jquery 在Internet Explorer中，图像上载预览不起作用，表单仅在第二次单击后提交

jquery internet-explorer

Jquery 在Internet Explorer中，图像上载预览不起作用，表单仅在第二次单击后提交,jquery,internet-explorer,submit,Jquery,Internet Explorer,Submit,我创建了一个简单的表单来上传图片它允许在选择后立即预览图像它可以在Chrome和Firefox中完美运行，但在IE中却不行，IE中： -图像预览根本不起作用； -只有在第二次（提交）按钮单击后，表单才会成功提交有没有办法解决这个问题你可以看到它正在发生代码是： //---------------------------------------------------- //img预览 //-----------------------------------------------

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

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

它可以在Chrome和Firefox中完美运行，但在IE中却不行，IE中： -图像预览根本不起作用； -只有在第二次（提交）按钮单击后，表单才会成功提交

有没有办法解决这个问题

你可以看到它正在发生

代码是：


//----------------------------------------------------
//img预览
//----------------------------------------------------
//
函数readURL（输入，pic）{
if（input.files&&input.files[0]）{
var reader=new FileReader（）；
reader.onload=函数（e）{
$（“#”+图片）
.attr（'src'，e.target.result）
.宽度（120）
.身高（120）；
};
reader.readAsDataURL（input.files[0]）；
}
}
检查代码后，您似乎有一个陈词滥调，它在任何地方都不会打开？谢谢您的回答，您完全正确。我已经更新到IE10，预览现在可以了。提交问题仍然存在。我相信这是因为隐藏的输入字段。有没有办法解决这个问题？
<!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>