`
jsntghf
  • 浏览: 2526367 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

iframe上传文件

阅读更多

上传文件页面(upload_file.rhtml)

 

<form action="/entries/upload" enctype="multipart/form-data" id="attachment_form" method="post">      
  <input id="attachment_uploaded_data" name="attachment[uploaded_data]" onchange="upload();" size="30" type="file" />
  <span id="spinner" style="display:none;">上传中 <img alt="Spinner" src="spinner.gif" /></span>
</form>

<script type="text/javascript">
  function upload(){
    var counter = parseInt(window.parent.$('attachments_counter').value) + 1;
    window.parent.$('attachments_counter').value = counter;
    $('spinner').show();
    var iframes = window.parent.$("attachment_iframes");
    iframes.appendChild(iframes.getElementsByTagName('iframe')[0].cloneNode(false));
    $('attachment_form').submit();
  }
</script>

 

在需要上传文件的页面加入以下代码:

 

  <input type="hidden" id="attachments_counter" value="0"/>
  <div id="attachment_iframes">
    <iframe src="upload_file" style="border:0px;height:50px;width:100%;" frameborder="0" border="0" cellspacing="0" allowTransparency="true" scrolling="no" resizable="no"></iframe>
  </div>

 

分享到:
评论

相关推荐

    ajax iframe jsp 无刷新上传文件.zip

    总结,"ajax iframe jsp 无刷新上传文件.zip"包含的知识点涵盖了Ajax与Iframe结合的文件上传技术,JSP服务器端处理,JavaScript字符串操作,Struts2的验证和链接标签,以及Spring入门和JSP请求Action的方法。...

    js加iframe轻松实现异步图片上传 可以预览 兼容FF,chrome,ie9

    在图片上传场景下,IFrame常用于解决跨域问题和模拟POST提交,因为它可以创建一个独立的上下文环境,使得文件上传操作不会影响到主页面。 以下是实现步骤: 1. 创建一个`&lt;input type="file"&gt;`元素,让用户选择需要...

    asp上传大全之四iframe上传组件

    可以使用`Request`对象的`BinaryRead`方法读取上传文件的内容,然后利用内置的文件系统对象(如`FileSystemObject`)进行文件操作。 5. **安全性考虑**:文件上传功能可能存在安全风险,比如文件注入攻击。因此,...

    HTML5 postMessage+iframe实现文件跨域异步上传

    在现代Web开发中,文件跨域异步上传是一项常见的需求,尤其在用户交互丰富的Web应用中。...本篇将重点讲解如何利用HTML5的`post...注意,为了安全性和性能,必须正确配置CORS策略,并在服务器端处理上传文件的逻辑。

    dojo_iframe无刷新上传文件demo.rar

    实例VS2010代码 dojo_iframe无刷新上传文件demo.rar dojo_iframe无刷新上传文件demo.rar dojo_iframe无刷新上传文件demo.rar dojo_iframe无刷新上传文件demo.rar dojo_iframe无刷新上传文件demo.rar

    JavaScript中三种异步上传文件方式_.docx

    本文将详细探讨三种异步上传文件的方法,包括使用浏览器插件、iframe模拟异步上传以及XMLHttpRequest2。 首先,浏览器插件如Flash和ActiveX是一种早期的异步上传方式。这种方式依赖于特定的浏览器插件,如Flash ...

    php之表单文件iframe异步上传

    通过`$_FILES`全局数组,你可以访问到上传文件的相关信息,包括文件名、类型、大小等。然后,你可以将文件移动到服务器上指定的目录,例如使用`move_uploaded_file()`函数。 安全性方面,需要注意以下几点: - 验证...

    文件上传,iframe跨域数据提交的实现

    2. **iframe上传**:在HTML5之前,利用iframe进行文件上传是一种常见的解决方案。由于文件上传是异步操作,需要新的窗口或框架来承载响应结果,因此iframe成为首选。这种方法可以避免刷新整个页面,保持用户界面的...

    php+iframe 无刷新上传

    可以限制上传文件类型,检查文件扩展名,或者使用`finfo_file()`检查文件的真实MIME类型。同时,确保文件存储路径的安全,避免路径遍历攻击。 8. **用户体验优化** 可以添加进度条显示文件上传进度,使用CSS和...

    ajax iframe上传.

    而纯AJAX上传文件存在一个问题,由于浏览器的安全限制,XMLHttpRequest对象无法跨域发送PUT或POST请求,这在文件上传时通常需要用到。因此,利用iframe作为目标可以解决这个问题,因为iframe允许跨域提交。 以下是...

    使用隐藏的Iframe实现ajax无刷新上传

    使用隐藏的Iframe实现Ajax无刷新上传的基本思路是:创建一个隐藏的Iframe作为文件上传的目标,当用户选择文件并提交表单后,表单数据会通过POST方式发送到服务器端处理文件上传操作。由于Iframe的存在,上传过程不会...

    iframe实现图片异步上传.doc

    综上所述,通过`iframe`实现图片异步上传是一种常见的技术方案,它结合了HTML、JavaScript(jQuery)、JSP以及服务器端的处理,实现了无刷新的文件上传体验,提高了用户的交互性和系统的响应速度。在实际应用中,还...

    通过Django的form及Ajax等多种方式上传文件

    通过Django的Form方式上传文件,简单,但无法局部刷新实现ajax效果; 通过js或jQuery方式,需要使用FormData对象,仍有些浏览器不兼容;...通过Form+iframe方式上传文件,兼容性最好。 里面含有全部源代码。

    jsp无刷新上传文件

    本示例以“jsp无刷新上传文件”为主题,结合使用了iframe、AJAX以及jsp技术,实现了这一功能。以下是相关的知识点详解: 1. **iframe(内联框架)**:iframe允许在HTML文档中嵌入另一个HTML文档,常用于实现页面的...

    在EBS FORM中上传文件

    前端接收到文件内容后,通常会创建一个隐藏的iframe或使用window.open方法打开一个新的浏览器窗口,让用户下载。 总结来说,在Oracle EBS中实现文件上传和下载功能需要结合前端Form设计、后端Java处理以及数据库或...

    JavaScript中三种异步上传文件方式

    隐藏的iframe上传文件 路径..."&gt; &lt;iframe name="frm" style="display:none"&gt;&lt;/iframe&gt; (true);"&gt; 附件: &lt;input type="file" name="myfile" style="display: inline"&gt;&lt;/p&gt; &lt;p id="upbtn"&gt;&lt;input style=...

    文件上传并在线浏览

    标题“文件上传并在线浏览”涉及的技术点主要是文件上传与在线预览,主要涵盖以下几个方面: 1. **文件上传**:文件上传是Web应用中常见的功能,用户可以通过选择本地文件将其上传到服务器。这一过程涉及到HTML表单...

    Ajax无刷新上传文件( jsp版本)

    ps:Ajax技术基本上可以说是由google公司带起来的,但少Gmail中上传文件用的还是 IFrame,所以说使用IFrame来上传文件是最好的选择。 我在这里这里用的技术是jsp,其实asp,php等也是一样可以这么实现的

    无刷新上传文件

    无刷新上传文件是一种提高用户体验的技术,它允许用户在不刷新整个网页的情况下进行文件上传,减少了等待时间和网络资源的消耗。这种技术广泛应用于各种Web应用程序,尤其是涉及到用户交互和大量数据交换的场景,如...

    ajax实现文件上传

    - `encType`:设置为 `multipart/form-data`,这是上传文件所需的 MIME 类型。 - `method`:设置为 `POST` 方法,以安全地传输文件数据。 - `target`:指定表单提交后的结果将显示在哪个 iframe 中。 2. **...

Global site tag (gtag.js) - Google Analytics