选择图片:
<input type="file" id="img">
<br/>
<button id="start">开始转换</button>
<div>
预览:<img id="imgShow" src="" alt="">
</div>
<b>Base64数据:</b>
<textarea rows=15 cols=60 id="conte"></textarea>
<button id='cpData'>复制</button><span id="succ"></span>
<div id="len">数据长度:</div>
<script>
var img = document.getElementById('img')
, imgShow = document.getElementById('imgShow')
, conte = document.getElementById('conte')
, len = document.getElementById('len')
, start = document.getElementById('start')
, cpData = document.getElementById('cpData');
cpData.addEventListener('click', cpDataF);
start.addEventListener('click', startt);
function startt() {
var imgFile = new FileReader();
imgFile.readAsDataURL(img.files[0]);
imgFile.onload = function () {
var imgData = this.result;
imgShow.setAttribute('src', imgData);
conte.value = imgData;
len.innerHTML += imgData.length;
}
}
function cpDataF() {
conte.select();
var cpd=document.execCommand("Copy");
cpd ? document.getElementById('succ').innerHTML = '复制成功' : console.warn('复制失败');
window.setTimeout(function () {
document.getElementById('succ').innerHTML = '';
}, 1000)
}
</script>