码迷,mamicode.com
首页 > 其他好文 > 详细

iframe加载onload之坑

时间:2018-06-15 16:06:07      阅读:440      评论:0      收藏:0      [点我收藏+]

标签:而且   dex   splay   end   cti   iframe   spl   问题   失败   

需求:点击按钮,下载一个文件,由于种种原因,需要借助iframe实现。

实现:点击按钮往页面上append一个iframe,将iframe的src设置为文件的url路径,实现下载。如果url不对或文件下载失败,提示下载失败。

畅想:iframe.onload=function(){ //下载成功;}      iframe.onerror = function(){ //下载失败 }

问题:想的挺好,可惜浏览器有意见。经测试,火狐及chorme都不支持onerror事件,而且,不管iframe加载是否成功,都会触发onload事件。

解决:奇技淫巧,通过title来判断页面是否正常加载。

示例:

var url = $this.attr(‘data-url‘);
    $(‘body‘).append(‘<iframe class="down-frame" id="down-frame" width="1" height="1" src="‘+url+‘" ></iframe>‘);
    var downFrame = document.getElementById("down-frame");

    downFrame.onload=function(e){
        var ifDoc = downFrame.contentDocument||{};
        var ifTitle = ifDoc.title;

        if ( ifTitle.indexOf("404")>=0 || ifTitle.indexOf("错误")>=0 ) {
            toastr.error(‘下载失败,请缩小查询范围后重新尝试!‘);
        }
    };

 

 

iframe加载onload之坑

标签:而且   dex   splay   end   cti   iframe   spl   问题   失败   

原文地址:https://www.cnblogs.com/newh5/p/9186714.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!