File: //www/sites/102466.com/index/index.html
<!DOCTYPE html>
<!-- saved from url=(0018)http://102466.com/ -->
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>base64 - 102466.com</title>
<meta name="keywords" conten="1024,102466">
<meta name="baidu-site-verification" content="code-X8eNXJOXry">
<meta name="description" content="102466.com ">
<style>
a:link,a:visited,a:hover,a:active {
color: #333
}
</style>
</head>
<body>
<script type="text/javascript">
var w, h;
function sub(eee) {
var myFile = document.getElementById("myFile").files[0];
var fileRead = new FileReader();
fileRead.readAsDataURL(myFile);
fileRead.onload = function (e) {
var base64 = e.target.result;
//var img = new Image();
//img.src = base64;
//document.getElementsByTagName("body")[0].appendChild(img);
var nImg = new Image();
nImg.onload = function () {
w = nImg.width;
h = nImg.height;
console.log("asdf: " + w + " " + h)
if (w > 600) {
document.getElementById("img").width = 600;
} else {
document.getElementById("img").width = w;
}
document.getElementById("img").src = base64;
}
nImg.src = base64;
var base = document.getElementById("base64");
if (eee == 1) {
base.innerHTML = base64.split(",")[1];
} else {
base.innerHTML = base64;
}
}
}
// 放大
function enlargement() {
var width = document.getElementById("img").width
document.getElementById("img").width = width + 10;
}
// 缩小
function shrink() {
var width = document.getElementById("img").width
document.getElementById("img").width = width - 10;
}
// 原始大小
function original() {
document.getElementById("img").width = w;
}
// 合适大小
function Adaptive() {
document.getElementById("img").width = 600;
}
</script>
<input type="file" id="myFile" onchange="sub()">
<button onclick="sub(1)">不带头部</button>
<button onclick="sub()">带头部</button>
<button onclick="enlargement()">放大图片</button>
<button onclick="shrink()">缩小图片</button>
<button onclick="original()">原始图片</button>
<button onclick="Adaptive()">大图适配</button>
<br>
<textarea readonly="" id="base64" rows="30" cols="100" style="float:left"></textarea>
<img id="img">
<div style="clear:both;position: absolute; bottom: 20px;">
<a style="text-decoration:none;" href="https://beian.miit.gov.cn/" target="_blank">粤ICP备14012912号-2</a>
</div>