首页 > 代码库 > Data Url生成工具之HTML5 FileReader实现
Data Url生成工具之HTML5 FileReader实现
百度经验版本号：怎样用HTML5的FileReader生成Data Url
上一篇讲了：用Visual Studio 2010编写Data Url生成工具C#版
今天用HTML5 FileReader实现了一下Data Url生成工具，上代码吧：
<!DOCTYPE html
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>怎样用HTML5的FileReader生成Data Url</title>
<meta name="keywords" content="Data Url,HTML5,FileReader"/>
<meta name="description" content="怎样用HTML5的FileReader生成Data Url"/>
<script type="text/javascript">
function buildDataUrl(source) {
var file = source.files[0];
if(window.FileReader) {
var fr = new FileReader();
fr.onloadend = function(e) {
document.getElementById("txtBase64").value = http://www.mamicode.com/e.target.result;"imgView").src = http://www.mamicode.com/e.target.result;"file" value="" onchange="buildDataUrl(this)" style="border:1px solid #808080; width:300px;" /><br />
<textarea id="txtBase64" cols="50" rows="20"></textarea>
<img id="imgView" src="" style="width:300px;" />
</body>
</html>终于效果图：
Data Url生成工具之HTML5 FileReader实现
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。