页面嵌入iframe层后多次加载出现iframe层内页面错乱问题

移动端做的iframe层的嵌入,后来发现多次打开同一个iframe后会出现iframe层内代码的叠加效果。

最初代码

<div class="jd_search_box"><iframe src="" frameborder="" id="search_iframe"></iframe></div>

js

$("#search_iframe").attr('srcdoc',strValue.result);//strValue.result是通过接口动态获取的

// 关闭页面与搜索页搭配使用

        function close_search() {

  $(".jd_search_box").removeClass("show");

            $("body").css("overflow", "auto");

        }


寻找原因发现是 因为关闭iframe层时只做了简单的隐藏,而没有清除已加载代码,而导致了iframe内代码多次加载了重复了。于是我做了一个简单的清除。每次关闭iframe层后就直接将iframe代码给删了,再次打开是才重新写入。简单粗暴!

<div class="jd_search_box"></div>

$(".jd_search_box").prepend('<iframe src="" frameborder="" id="search_iframe"></iframe>')

。。。

$("#search_iframe").attr('srcdoc',strValue.result);

function close_search() {

            $(".jd_search_box").removeClass("show");

            $("#search_iframe").remove();

            $("body").css("overflow", "auto");

        }

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容