发布到 iframe 在 Internet Explorer 中不起作用？答案

【问题标题】：post to iframe don´t work in Internet explorer?发布到 iframe 在 Internet Explorer 中不起作用？
【发布时间】：2012-06-22 01:27:20
【问题描述】：

我有一个难题。已经在该站点上进行了研究，并尝试了许多提出的解决方案，但没有一个在 Internet Explorer 8 中有效（是我在我的机器上安装的版本）。在 Chrome 和 Firefox 中运行良好。我有一个网站，用户需要上传 10 张照片。我需要进行上传并将它们显示在页面上的一个 div 中，无需 Flash 且无需重新加载页面。我使用了设置表单目标属性的技术，在 iframe 中发布帖子，iframe 发布帖子，当重新加载时，它只是一个带有上传图像的 img 标签（我在服务器端脚本中执行 - PHP) 在 Internet Explorer 中，iframe 的内容不会改变，帖子不会发生。

有人可以帮助我吗？已经在论坛里研究了很多，但是这些问题大部分是由javascript动态生成的iframe，但在我的例子中，iframe已经在html中了

这是我的代码：

//javascript

$(document).ready(function() {          
//this part works in every browser, is jut´s to triger click in input type file    
   $(".div_input_file").click(function(){               
        var rel = $(this).attr("rel");              
        $(".arq"+rel).trigger('click');             
    })
}); 

function loadPicture(number)
{               
    $(".remover_produto").remove();
    //just a gif animation until ends animation
    $("#image_load_"+number).attr("src","images/loading.gif");
    $("#image_load_"+number).css("width","172px");      
    $("#image_load_"+number).css("height","176px");     
    //when iframe load after post
    $("#upload_target_"+number).load(function() {
        //get image that was loaded in iframe after post
            var image = $("#upload_target_"+number).contents().find("img").attr("src");
        $("#div_input_file_"+number).html("<img src='"+image+"' alt=''  class='img_uploaded' />");
        $("#div_input_file_"+number).parent().append('<a class="remover_produto" rel="remover_'+number+'"');           
    });   

}   

    //html
    <iframe id="upload_target_1" class="upload_target" name="upload_target_1" src="upload.php"></iframe>
    <div id="div_input_file_1" class="div_input_file" rel="1">
        <img src="images/criar_anuncio/gallery_pic05.png" alt="" id="image_load_1" />
    </div>      
    <form action="/upload.php" id="form_upload_1" enctype="multipart/form-data" method="post" target="upload_target_1" onsubmit="loadPicture(1)">   
        <input name="arquivo" type="file" size="30" class="arquivo arq1" onchange="$('#form_upload_1').submit();"/>
        <input type="hidden" name="num_imagem" value="1" /> 
    </form>

【问题讨论】：

在其他错误中，("#div_input_file_"+number).parent().append('<a class="remover_produto" rel="remover_'+number+'"'); 这一行在语法上是不正确的。您会注意到您没有关闭标记。
在我的代码中是正确的结束标记，我缩短了功能减少，这里只显示相关的内容。还有什么问题？
您可以使用 ajax 代替 iframe...
我不能使用 ajax，因为我需要上传文件。 ajax 不允许上传文件

标签： jquery html internet-explorer post iframe

【解决方案1】：

终于找到问题了。这些行导致了问题：

$(document).ready(function() {          
//this part works in every browser, is jut´s to triger click in input type file    
   $(".div_input_file").click(function(){               
        var rel = $(this).attr("rel");              
        $(".arq"+rel).trigger('click');             
    })
});

为了设置输入类型文件的样式，我使用了以下技术：点击一个div，触发隐藏的输入文件类型。

此操作会导致 Internet Explorer 中的错误。我把正常的输入类型文件放了没有样式，这样我就可以测试了，可以证明它运行良好

感谢所有帮助过的人

【讨论】：