html5 base64

最新推荐文章于 2021-06-16 04:21:22 发布

原创最新推荐文章于 2021-06-16 04:21:22 发布 · 279 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #json #ViewUI

html 专栏收录该内容

19 篇文章

订阅专栏


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>html5 img to base64 example</title>
<script type="text/javascript" src="/thirdparty/jQuery/jquery-2.0.0.min.js"></script>
</head>
<body>
<input type="file" accept="image/*" "multiple"="multiple" id="file"/>
</body>
<script type="text/javascript">
$('#file').bind('change',function(){
	saveImg(this);
});
function saveImg(obj) {
	var files = obj.files;
	for(var i = 0, len = files.length; i < len; i++) {
		var file = files[i];
		getBase64(file, function(src) {
			$.ajax({
				url : 'save',
				method : 'POST',
				context : document.body,
				cache : false,
				data : {"fileName" : file.name, "contentType" : file.type, "size" : file.size, "base64Url" : src },
				success : function(data, textStatus, jqXHR) {
					//$('#img').attr('src', src);
				},
				dataType : "json"
			});
		})
	}
}
function getBase64(file, callback) {
	var reader = new FileReader();
	reader.onload = function (event) {
		var src = event.target.result;
		if(callback) {
			callback(src);
		}
	};
	reader.readAsDataURL(file);
}
</script>
</html>