下面是编程之家 jb51.cc 通过网络收集整理的代码片段。
编程之家小编现在分享给大家,也给大家做个参考。
<!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 = e.target.result; document.getElementById("imgView").src = e.target.result; }; fr.readAsDataURL(file); } } </script> </head> <body> <p>如何用HTML5的FileReader生成Data Url</p> <input type="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>
以上是编程之家(jb51.cc)为你收集整理的全部代码内容,希望文章能够帮你解决所遇到的程序开发问题。
如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。