片段 1片段 2
上传代码js部分
//包上传
$('.up_apk').change(function () {
var obj = $(this);
var form_data = new FormData();
// 获取文件
var file_data = obj.prop("files")[0];
// 表单信息
form_data.append("id", "001");
form_data.append("name", "test");
form_data.append("apk", file_data);
if (file_data.type != 'application/vnd.android.package-archive') {
alert('文件格式错误');
return false;
}
$('.jdt').slideDown('fast');
var size = Math.round(file_data.size / 1024 / 1024 * 100) / 100 + 'MB';
$('.jdt .size').html(size);
//提交
$.ajax({
type: "POST",
url: 'url',
dataType: "json",
processData: false, // 注意：让jQuery不要处理数据
contentType: false, // 注意：让jQuery不要设置contentType
data: form_data,
xhr: function () { //获取ajaxSettings中的xhr对象，为它的upload属性绑定progress事件的处理函数
myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) { //检查upload属性是否存在
//绑定progress事件的回调函数
myXhr.upload.addEventListener('progress', progressHandlingFunction, false);
}
return myXhr; //xhr对象返回给jQuery使用
},
success: function (d) {
if (d.code == 200) {
//处理返回信息
} else {
alert(d.msg);
}
$('.jdt').slideUp('slow');
},
error: function (e) {
alert("错误！！");
}
});
function progressHandlingFunction(e) {
var curr = e.loaded;
var total = e.total;
var wan = Math.round(curr / 1024 / 1024 * 100) / 100;
var bfb = Math.round(curr / total * 10000) / 100;
$('.jdt .wan').html(wan + 'MB');
$('.jdt .bfb').html(bfb + '%');
$('.jdt .jindu').css('width', bfb + '%');
}
});
html部分
<style>
.jdt{display: none;}
.jdtjd{width: 500px;height: 15px;margin: 20px 0;border:1px solid #0a8c8b;border-radius: 7px;}
.jdtcs{width: 500px;height: 10px;text-align: center;color:#006400;margin-top: -49px;}
.jdt i{font-style:normal;}
.jdtjd .jindu{display: block;height: 15px;width: 0%; border-radius: 7px; background-color: #00ccca;z-index: -1;}
.jdtcs .bfb{text-align: center;}
.jdtcs .size{float: right;}
.jdtcs .wan{float:left;}
</style>
<input class="up_apk" type="file" value="本地上传" accept=".apk"/>
<div class="jdt">
<div class="jdtjd"><i class="jindu"></i></div>
<div class="jdtcs"><i class="wan">0MB</i><i class="bfb">0%</i><i class="size">0MB</i></div>
</div>
