- 选择图片:
- <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; //base64数据
- 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>
将文件转成编码base64码
最新推荐文章于 2025-07-10 15:48:30 发布
本文介绍了一个简单的网页工具,用于将用户上传的图片文件转换为Base64编码格式,并提供预览与复制功能。该工具使用HTML、CSS及JavaScript实现。
部署运行你感兴趣的模型镜像
您可能感兴趣的与本文相关的镜像
Python3.10
Conda
Python
Python 是一种高级、解释型、通用的编程语言,以其简洁易读的语法而闻名,适用于广泛的应用,包括Web开发、数据分析、人工智能和自动化脚本
1543

被折叠的 条评论
为什么被折叠?



