Internet Explorer 9 (8 ?) iframe 删除后不显示 display:none

Question

如果我在没有“display:none”的情况下将 iframe 与谷歌地图一起放置，它会正确显示，但是当我在 css 类中添加 display:none 然后我用 jquery 将其删除时，带有地图的 iframe 不会显示。

HTML：

<div id="kontakt_siedziba">

        <iframe id="mapa_siedziba" class="hidden" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d10163.095243410511!2d16.666852538623033!3d50.44531365108525!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x3d08e591f3fac383!2sJatax+Sp.+z+o.o.!5e0!3m2!1spl!2spl!4v1466029556470" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>

        </div>

CSS：

  iframe#mapa_siedziba {
                float: right;
            }

    .hidden {
                display: none;
            }

#kontakt_siedziba, #kontakt_baza {
            height: 140px;
            border: 0px solid #007fff;
            border-radius: 5px;
            transition: padding 1s;
        }

.unfolded_map {
            padding: 20px;

        }

脚本：

<script>

    var clicked=0;
    $(document).ready(function(){

        $("#siedziba").click(function(){
            if(clicked==0){

            $("#kontakt_siedziba").addClass("unfolded_map").animate(
                {height: '300px',borderWidth: '4'},
                function(){ $("#mapa_siedziba").fadeIn(500, function(){
                    clicked=1;

                }); } );

            }else if(clicked==1){

                $("#mapa_siedziba").fadeOut(1000, function(){

                    $("#kontakt_siedziba").animate(
                        {height: '140px',borderWidth: '0'},
                        function()
                        {
                            clicked=0;
                        }).removeClass("unfolded_map") ;

                });

            } 
        });

    });
</script>

我也尝试了 removeClass 而不是淡入，但它也不起作用

Answer 1

你可以尝试两种方法：

1. 将 iframe 包装到 div 中并隐藏/取消隐藏 div
2. 删除 iframe dom 元素并读取它

例子

var detachedItem = $('#mapa_siedziba').detach();
setTimeout(function() {
   $("#open_menu").click(function()  {
      $("#kontakt_siedziba").append($detachedItem);
   });
}, 4);