1. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <button id="aa">上传</button>
    <form id="ajaxUploadform"  action="/api/upload" role="form" method="post" target="ajaxIframe" enctype="multipart/form-data">
        <input type="file" id="ajaxFile" name="ajaxFile"/></form>
    <iframe name='ajaxIframe' id='ajaxIframe' ></iframe>
    <script>
    var aa=document.getElementById("aa");
        aa.addEventListener("click",function(){
            document.getElementById("ajaxUploadform").submit()
            document.getElementById("ajaxIframe").onload=function(){
                var result=document.getElementById('ajaxIframe').contentWindow.document.body.innerText;
                alert(result)
            }
        },false)
  2.  
  3. </script>
  4.  
  5. </body>
    </html>

form+iframe+file 页面无刷新上传文件并获取返回值的更多相关文章

  1. web 开发之js---巧用iframe实现jsp无刷新上传文件

    首先要说的就是 ajax 是无法实现上传文件的,可以想一下ajax与后台通信都是通过传递字符串,怎么能传递文件呢?其实出于安全考虑js是不能操作文件的,所以就不要再说用ajax来实现文件的上传了,这是 ...

  2. iframe无刷新跨域上传文件并获取返回值

    通常我们会有一个统一的上传接口,这个接口会被其他的服务调用.如果出现不同域,还需要无刷新上传文件,并且获取返回值,这就有点麻烦了.比如,新浪微博启用了新域名www.weibo.com,但接口还是使用原 ...

  3. ajax ＋jsp＋iframe无刷新上传文件[转]

    http://hi.baidu.com/zj360202/blog/item/f23e3711f929c774cb80c475.html ajax jsp 无刷新上传文件 2009-10-26 16: ...

  4. $_FILES参数详解及简单<form>表单无刷新上传文件

    $_FILES:经由 HTTP POST 文件上传而提交至脚本的变量,类似于旧数组$HTTP_POST_FILES 数组(依然有效,但反对使用)详细信息可参阅 POST方法上传 $_FILES数组内容 ...

  5. jquery.form 和MVC4做无刷新上传DEMO

    jquery.form 和MVC4做无刷新上传DEMO HTML: <script src="~/Scripts/jquery-1.10.2.min.js"></ ...

  6. jquery ajax php 无刷新上传文件 带 遮罩 进度条 效果的哟

    在很多项目中都会叫用户上传东西这些的,自从接触了jquery 和ajax之后就不管做什么,首先都会想到这个,我这个人呢?是比较重视客户体验的,这次我这边负责的是后台板块,然后就有一块是要求用户上传照片 ...

  7. jQuery+php+ajax实现无刷新上传文件功能

    jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...

  8. 基于jQuery的ajax系列之用FormData实现页面无刷新上传

    接着上一篇ajax系列之用jQuery的ajax方法向服务器发出get和post请求写,这篇主要写如何利用ajax和FormData实现页面无刷新的文件上传效果,主要用到了jQuery的ajax()方 ...

  9. Ajax 无刷新上传文件插件 uploadify 的使用

    在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...

随机推荐

  1. php 获取开始日期与结束日期之间所有月份

    function showMonthRange($start, $end) { $end = date('Ym', strtotime($end)); // 转换为月 $range = []; $i ...

  2. CentOS 7 bonding模式双网卡绑定

    1.1    查看系统内核是否支持bonding [root@cobbler-node1 ~]# cat /boot/config-3.10.0-693.el7.x86_64 | grep -i bo ...

  3. 正则表达式-基础知识Review

    正则表达式(Regular Expression)是计算机科学的一个概念. 正则表达式使用单个字符窜来描述.匹配一系列符合某个句法规则的字符窜. 在很多文本编辑器里, 正则表达式通常用来被检索替换哪些 ...

  4. C语言中float如何存储？(转载)

    float 内存如何存储的 类型 存储位数 总位数 偏移值(offset) 数符(S) 阶码(E) 尾数(M) 短实数(float) 1 8 23 32 127 长实数(double) 1 11 52 ...

  5. openstack源

    为了红帽系在云计算的市场份额,CentOS推出了官方openstack软件源. http://mirrors.ustc.edu.cn/centos/6/cloud/x86_64/openstack-j ...

  6. Codeforces Round #524 (Div. 2) C. Masha and two friends 思路

    题目:题目链接 思路:直接计数显然是不好处理的,但分情况讨论只要不写错这题是一定可以出的,但这样基本做完这个题就没时间做其他题了,但当时我就这么蠢的这样做了,比赛一个半小时的时候突然发现一个似乎可行的 ...

  7. mysql--timestamp加减

    利用timestamp()对timestamp类型进行秒加减操作: 1.加10秒: 2.减10秒:

  8. HDU 3032 Nim or not Nim?（Multi_SG，打表找规律）

    Nim or not Nim? Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)T ...

  9. ckeditor添加日历控件

    这里日历控件用的是开源的My97DatePicker,先看下效果图: 1.点击左侧自定义的日历控件按钮,弹出日历控件对话框. 2.点击确定,日历控件添加的表单设计器中,同时保留日历的控件样式 3.点击 ...

  10. IOS开发---菜鸟学习之路--（十四）-将BASE64图片转换成Image

    本文基本全部都是代码 首先是.H文件 #import <Foundation/Foundation.h> @interface Base64AndImageHelp : NSObject ...