`

用iframe解决模态窗口文件下载问题

    博客分类:
  • html
 
阅读更多

在模态窗口中,window.open(),form.submit() 等函数不可执行, 提示“不支持此接口”。

 

由于需要在模态窗口中弹出一个新的窗口来执行文件下载代码,无法弹窗使下载功能不可用。

 

参考文章 http://blog.163.com/zyc951018@126/blog/static/1397628992011111543924384/发现了解决办法。

 

在使用 window.showModelDialog(url, params, winStyle) 函数打开的窗口中,无法再打开任何新的非模态窗口,可以通过使用隐藏子框架来执行下载代码的方式解决。

 

win.htm 页面代码,增加一个隐藏的iframe子框架,并将form提交到此子框架。

 

<iframe id="emptyFrame" name="emptyFrame" height="0px" onreadystatechange="frameReady()"></iframe>
<form id="form1" name="form1" target="emptyFrame" method="post" action="fileDownload.do">
  <input id="fileName" name="fileName" />
</form>

  

win.js 页面代码

 

function btnSubmit(){ //下载按钮的点击事件
  form1.fileName = "xxx";
  form1.submit();
  btn.disabled = true;
}

function frameReady(){ //子框架加载完成事件
  if(btn.disabled){
    btn.disabled = false;
  }
}

 

分享到:
评论

相关推荐

    5个Jquery模态窗口

    在实际应用中,开发者应根据项目的具体需求,权衡功能、性能和用户体验等因素,选择最合适的模态窗口解决方案。同时,脚本之家(http://www.jb51.net/)作为一个推荐的论坛,提供了许多编程相关的资源和讨论,可以...

    iziModal-时尚炫酷的jQuery模态窗口插件

    在实际应用中,iziModal易于集成到现有的jQuery项目中,只需引入必要的JavaScript和CSS文件,然后通过简单的API调用来创建和控制模态窗口。iziModal的文档详尽,提供了丰富的示例和选项设置,方便开发者快速上手。 ...

    在使用showModalDialog中为解决刷新时弹出新窗口时用到iframe所带来的一个问题

    在提供的压缩包文件"iframe_showModalDialog"中,可能包含了示例代码或文章,用于演示如何正确地结合`iframe`和`showModalDialog`以解决刷新时的窗口问题。通过研究这些资源,开发者可以获得更深入的理解,并解决...

    JAVASCRIPT模式窗口中下载文件无法接收iframe的流

    JavaScript开发中,模式窗口下载文件时遇到无法接收iframe流的问题,通常发生在弹出式窗口中尝试与服务器进行数据交换时。理解此问题需要我们探讨几个关键点:模式窗口的定义、iframe的作用、以及JavaScript中关于...

    解决showModalDialog 跨域 iframe

    通过以上步骤,你可以成功地用`iframe`解决`showModalDialog`的跨域问题。但请注意,这种方法可能会带来额外的安全性和性能考虑,因此在实际应用中需权衡利弊。 **示例代码(demo)** 在提供的`demo`文件中,可能...

    div覆盖 iframe

    模态窗口是一种阻止用户与页面其余部分交互,直到关闭窗口或完成特定操作的设计模式。在这个场景下,`subModal`可能定义了如何创建和控制`div`覆盖`iframe`的动画、透明度以及关闭机制。 总的来说,这个场景涉及到...

    ModalLayer模态框插件js弹出框

    - **js弹出框**: 使用JavaScript实现的弹出窗口,可以动态创建和控制。 2. **ModalLayer特点** - **多样化形式**: ModalLayer支持多种类型的模态框,满足不同场景的需求。 - **倒计时**: 可以设定一个时间限制,...

    frameset 上传文件窗口最小化(未实现)

    6. **上传窗口的优化**:为了提升用户体验,可以考虑使用模态对话框(modal dialog)或浮动层(overlay)来代替传统的frameset,这样用户在上传文件时既可以保持对主页面的视觉联系,又可以方便地关闭或最小化上传...

    showModelDialog弹出文件下载窗口的使用示例

    `showModelDialog` 是一种常用于前端Web应用中的方法,用于弹出一个模态对话框,通常用于展示信息、确认操作或执行特定任务,如文件下载。在这个场景中,我们讨论的是如何使用 `showModelDialog` 实现一个文件下载的...

    跨框架示例(iframe).rar

    - Firefox和其他现代浏览器对iframe的支持更全面,但为了确保跨浏览器兼容性,开发者需要编写适当的polyfills或使用jQuery等库来解决差异。 5. **frames.htm和x.html的可能内容** - `frames.htm`可能是主页面,它...

    easyui导出excel无法弹出下载框的快速解决方法

    由于数据导出可能涉及到大量的数据传输,不适合在当前页面完成,所以使用`iframe`或者新开窗口的方式来下载文件是一个更合适的解决方案。 1. 使用`iframe`: 由于`iframe`可以在后台加载内容,可以用来处理文件...

    jQuery点击弹出窗口放大图片和PDF文件预览插件.zip

    2. **弹出窗口**:可能是使用模态对话框(modal dialog)或者浮动层(lightbox)实现,用于显示图片或PDF预览。jQuery UI和Bootstrap都提供了创建此类效果的工具。 3. **图片预览**:可能使用`&lt;img&gt;`标签的`src`属性...

    jqdialog:jqueryUI 与 iframe

    jQuery UI Dialog是一款基于jQuery库的强大对话框组件,它提供了丰富的可定制化选项和多种交互模式,如模态对话框、非模态窗口、拖动、调整大小等功能。在某些场景下,我们可能需要在Dialog中嵌入外部页面或者动态...

    thickbox3.0

    10. **维护和社区支持**:作为一款流行的技术,Thickbox有一个活跃的开发者社区,提供了许多示例代码、插件和解决问题的讨论,帮助用户解决在使用过程中遇到的问题。 综上所述,Thickbox3.0是一个强大且易用的...

    bootstrap后台模板

    模板使用了iframe框架来构建导航栏,这是一个常见的做法,可以将导航部分与主要内容分离,使得页面结构更清晰,同时方便独立更新导航栏而不会影响到其他部分。通过index.html作为入口,开发者可以轻松地管理和切换...

    layer弹出层

    在Layer的使用过程中,首先需要从Layer的官方网站下载最新版本的layer.js文件。这个文件包含了Layer的核心功能,通过引入到网页中,就可以利用其提供的API来创建各种弹出层。 1. **基础使用**:在HTML文档中,你...

    JQuery 弹出窗口 插件

    通常,这些文件位于下载的压缩包中的"css"和"js"目录下。 2. **基本用法**:在HTML元素上添加"data-rel"或"class"属性,来指定使用ColorBox的元素集合。例如,对于一组图片,你可以使用"data-rel='colorbox'",对于...

    IE7 IE8弹出框子在IE后面(OCX)

    标题 "IE7 IE8弹出框子在IE后面(OCX)" 描述的是一个常见的技术问题,即在使用Internet Explorer 7或8时,通过调用OCX控件或其他方式打开的弹出窗口可能会被浏览器窗口遮挡,出现在IE主窗口的后面,导致用户无法...

    修改jquery里的dialog对话框插件为框架页(iframe) 的方法

    从提供的文件信息中,我们可以梳理出关于jQuery Dialog插件以及如何将其修改为使用iframe作为框架页的一些知识点。以下是详细的知识点说明: 1. jQuery Dialog插件简介: - jQuery Dialog是一个功能强大的UI组件,...

    bgiframe_2.1.1.zip

    在描述中提到的"jquery dialog",是jQuery UI库中的一个组件,它提供了一种创建模态或非模态对话窗口的方式。这些对话窗口常用于显示警告、确认信息或者进行表单输入等交互。然而,当对话框被设置为透明或者半透明时...

Global site tag (gtag.js) - Google Analytics