码迷,mamicode.com
首页 > Web开发 > 详细

使用jquery提交FormData数据

时间:2018-05-22 16:41:37      阅读:1653      评论:0      收藏:0      [点我收藏+]

标签:nbsp   detail   span   var   后台   ssd   进度   script   doc   

https://blog.csdn.net/u011500781/article/details/54931716

http://yunzhu.iteye.com/blog/2177923

***********************************************

<!doctype html>
<html>
<head>
    <title>测试</title>
    <meta charset="utf8">
    <script src="../js/jquery-1.11.3.min.js"></script>
</head>
<body>
    <form id="form">
        <input name="file" type="file" />
        <input name="a" value="1" />
        <input value="2" />
    </form>
    <button>提交</button>
</body>
</html>
<script>
    $(function() {
        // 监听上传进度
        var xhrOnProgress = function(fun) {
            xhrOnProgress.onprogress = fun; //绑定监听
            return function() {
                //通过$.ajaxSettings.xhr();获得XMLHttpRequest对象
                var xhr = $.ajaxSettings.xhr();
                //判断监听函数是否为函数
                if (typeof xhrOnProgress.onprogress !== function)
                    return xhr;
                //如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去
                if (xhrOnProgress.onprogress && xhr.upload) {
                    xhr.upload.onprogress = xhrOnProgress.onprogress;
                }
                return xhr;
            }
        }

        $(button).on(click, function() {
            var formData = new FormData($(#form)[0]);// 自动搜索表单信息(表单内没有name属性的input不会被搜索到),IE<=9不支持FormData
            formData.append(b, 3);// 还可以添加额外的表单数据

            $.ajax({
                type: post,
                url: ../../../material/jQueryFileUpload?type=1,
                data: formData,
                contentType: false,// 当有文件要上传时,此项是必须的,否则后台无法识别文件流的起始位置(详见:#1)
                processData: false,// 是否序列化data属性,默认true(注意:false时type必须是post,详见:#2)
                xhr: xhrOnProgress(function(e){// (详见:#3)
                    var percent=e.loaded / e.total;//计算百分比
                    $(body).append(->+ percent);
                }),
                success: function(data) {
                    $(body).append(完成);
                }
            })
        })
    })
</script>

 

使用jquery提交FormData数据

标签:nbsp   detail   span   var   后台   ssd   进度   script   doc   

原文地址:https://www.cnblogs.com/zhao1949/p/9072633.html

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