<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<title>上传视频</title>
|
<link rel="stylesheet" href="css/basic.css">
|
<link rel="stylesheet" href="src/css/layui.css">
|
</head>
|
<body>
|
<button type="button" class="layui-btn" id="test5"><i class="layui-icon"></i>上传视频</button>
|
<button type="button" class="layui-btn" id="upload"><i class="layui-icon"></i>确认上传</button>
|
<script src="src/layui.js"></script>
|
<script>
|
layui.use(['upload', 'jquery'], function() {
|
var upload = layui.upload;
|
var $ = layui.jquery;
|
var StationId = 42000570;
|
|
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;
|
};
|
};
|
|
// 上传视频
|
upload.render({
|
elem: '#test5'
|
,url: 'MyFileAction!uploadStationFile'
|
,auto: false
|
,bindAction: '#upload'
|
,multiple: true
|
,number: 1
|
,data: {
|
json:JSON.stringify( {
|
StationId: 123
|
})
|
}
|
,accept: 'video' //视频
|
,progress: function(e , percent) {
|
console.log(e);
|
console.log("进度：" + percent + '%');
|
//element.progress('progressBar',percent + '%');
|
}
|
,done: function(res, index, upload) {
|
console.log(res);
|
}
|
});
|
});
|
</script>
|
</body>
|
</html>
|
