root
/
UseStudio.NodjsUpload


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
							<html>
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="http://www.1473.cn/uform.js"></script>	
</head>
<style>
form p span{
	margin-left: 20px;
}
</style>
<body>
	<form action="">
		<input type="file" id="uploadfile" >
		<button id="uploadbtn">开始上传</button>
		<p>文件名<span id="filename">无</span></p>
		<p>大小<span id="filesize">0</span></p>
		<p>进度<span id="progress">0%</span></p>
	</form>
</body>
<script src="./splitUpload.js"></script>	
<script>
	var els = {
		uploadfile: $("#uploadfile")[0],
		uploadbtn: $("#uploadbtn")[0],
		filename: $("#filename")[0],
		filesize: $("#filesize")[0],
		progress: $("#progress")[0]
	}
	// 当前上传文件的file对象
	var currentFile = null;
	// 暂停的标签
	// var stopSign = true;
	// 开始上传事件
	uploadbtn.onclick = function(e){
    	e.preventDefault();

		if(!currentFile)
			return;

		// 开始上传
		beginUpload(currentFile)
	}
	// 选择文件事件
	uploadfile.onchange = function(){
		var file = uploadfile.files[0], name, size;

		if(!file || !file.name)
			return;

		name = file.name;
		size = file.size;

		els.filename.innerHTML = name;
		els.filesize.innerHTML = size > 1024
            ? size / 1024 > 1024
	            ? size / (1024 * 1024) > 1024
		            ? (size / (1024 * 1024 * 1024)).toFixed(2) + 'GB'
		            : (size / (1024 * 1024)).toFixed(2) + 'MB'
	            : (size / 1024).toFixed(2) + 'KB'
            : (size).toFixed(2) + 'B';
        // 设置当前文件
		currentFile = file;
	}
	/**
	 * 开始上传
	 * @param  {File} file  上传的文件
	 */
	function beginUpload(file){
		
        splitUpload(file, function(thunkTo, totalSize) { // success
      		progress.innerHTML = (100*thunkTo/totalSize).toFixed(2) +'%';
      		if(thunkTo === totalSize)
          	progress.innerHTML += '   写入成功';
        }, function(res) { // error
  			progress.innerHTML += '   写入失败';
        })
	}
</script>	
</html>