主要代码示例
在线测试地址:点击体验:
html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>上传视频文件测试</title>
<script type="text/javascript" src="http://www.cloudroom.com/api/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.cloudroom.com/api/dbsdk/dbupload.1.0.0.min.js"></script>
</head>
<body>
<div class="upLoadBox">直接上传文件</div>
<div class="upLoadProgress">
<div class="span1">上传进度：</div>
<div class="span2">
<div class="span3">
<div class="span4"></div>
</div>
</div>
</div>
<div class="cancelUpload">取消上传</div>
<form id="form1">
<input id="uploadVideoNow-file" type="file" style="display:none;"/>
</form>
</body>
</html>
js 代码
//初始化
var initSucess = false;
var isInit = CR_DBSDK.initsdk("137********","******");
console.log(isInit)
if(isInit.resCode == "0"){
console.log("初始化成功");
initSucess = true;
}else{
initSucess = false;
console.log("初始化失败，请检查错误原因");
}
$(function(){
$(".upLoadBox").unbind().mouseover(function(){
$(this).addClass("onadd");
}).mouseout(function(){
$(this).removeClass("onadd");
}).mouseup(function(){
$(".cancelUpload").hide();
if(initSucess){
$('#uploadVideoNow-file').click();
}
});
$('#uploadVideoNow-file').on('change', function (e) {
var videoFile = this.files[0];
var fileSize = this.files[0].size;
var fileName = this.files[0].name;
console.log(videoFile,)
CR_DBSDK.startUploadFile(videoFile,fileName,fileSize)
})
$(".cancelUpload").unbind().mouseover(function(){
$(this).addClass("onadd");
}).mouseout(function(){
$(this).removeClass("onadd");
}).mouseup(function(){
CR_DBSDK.cancelUpload();
});
})
//上传结果的监听
CR_DBSDK.on("crdb_uploadfile_callback",function(data){
console.log(data)
if(data.resCode == "0"){
console.log("上传成功");
}else{
console.log("上传失败");
}
$(".upLoadProgress").hide();
$(".cancelUpload").hide();
})
//上传进度
CR_DBSDK.on("crdb_notify_progress",function(data){
$(".upLoadProgress").show();
$(".cancelUpload").show();
$(".span4").css("width",data.progress)
console.log(data)
})
CR_DBSDK.on("crdb_cancelupload_callback",function(data){
console.log(data)
$(".upLoadProgress").hide();
$(".cancelUpload").hide();
})