原文: http://my.oschina.net/rst/blog/638135
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <title>preview image</title> </head> <body> <form> <input type="file"> </form> <script src="/static/js/jquery.min.js"></script> <script> $('input[type="file"]').change(function(e){ reader = new FileReader(); reader.readAsDataURL(e.target.files[0]); reader.onload = function(){ $('body').append($('<img />', {src: reader.result})); }; }); </script> </body> </html>