如何通过iframe来实现导入导出的效果

2024-10-13 19:32:45

1、我们先说下载吧,思路是创建一个隐藏的iframe,支持动态指定url实现下载文件流数据。

2、【下载】封装一个公共方法,如下图,第一次调用没有创建iframe标签,第二次调用直接执行url,刷新页面。框架会自动跟浏览器通信,如果是文件就会弹出保存文件的窗口,但不会新建空白页面。需要注意的是,这个iframe需要是隐藏的,不影响当前主页面的布局。iframe.className = "dnone";样式表->.dnode{display:none}

如何通过iframe来实现导入导出的效果

6、【上传】上传类似下载的思路(请参考下载),只是多一个form标签的操作。如下图,关联form上传表单和iframe之前的关系,通过target属性,这样表单提交的文件数据,是直接传到iframe的。

如何通过iframe来实现导入导出的效果

7、【上传】验证上传之后的结果信息,也要监听iframe的onload事件,然后完成解析html的逻辑。

猜你喜欢