我的代码看起来像这样;

<form>
<input type="text" />
<input type="file">
</form>

<div id="notes"></div>

我有文字变量可以工作,但是,我无法让这个愚蠢的图像工作,我看过许多教程,但我根本无法做到这一点

我知道我必须做点事
(document.getElementById("file").files)[0] != null) {
var pic = (document.getElementById("file").files)[0];
var imgUrl;
var reader = new FileReader();
reader.onload = function(e) {
var imgURL = reader.result;
saveDataToLocalStorage(imgURL);
reader.readAsDataURL(pic);

图片,然后使用JSON.parse取回网址并将其显示在页面上

但我无法弄清楚它是如何工作的,也找不到任何不太复杂的示例即可将其实现到自己的代码中

在这个小提琴中,我提供了我目前的所有代码
http://jsfiddle.net/VXdkC/

我真的希望你们能帮帮我,过去两天我一直在搞弄这个东西,这开始让我感到沮丧:(

最佳答案

非常简单

var pic = document.getElementById("file").files[0];
var imgUrl;
var reader = new FileReader();
reader.onload = function(e) {
  var imgURL = reader.result;
  $('#notes').prepend("<div class='entry'><h1>" + Title + "</h1></p>" + "<p>" + Message + "<img src=" + imgURL + "></p> </div>");

  var notes = $('#notes').html();
  localStorage.setItem('notes', notes);
  saveDataToLocalStorage(imgURL);
}
reader.readAsDataURL(pic);

http://jsfiddle.net/VXdkC/2/

09-25 17:01
查看更多