jQuery mobile wybierz obraz do późniejszego przesłania

Question

Buduję małą mobilną aplikację internetową przy użyciu JQuery Mobile. Teraz chcę wybrać zdjęcie w telefonie i uzyskać informacje na jego temat, aby móc je później przesłać z aplikacji. Czy to w ogóle możliwe?

Być może znajduję się w trybie offline i nadal mogę wybrać obraz, który chcę przesłać.

Answer 1

Jeśli przeglądarka swój cel telefonu obsługuje file upload input type i FileAPI (np iOS 6.0 Safari)

<input type="file" name="image" accept="image/*" capture> 

następnie można pozwolić użytkownik wybrać istniejący plik, a nawet korzystać z aparatu, aby zrobić zdjęcie, a następnie odczytać niektóre atrybuty pliku obrazu (nazwa pliku, rozmiar, typ, data modyfikacji).

$("input[type=file]").change(function(){ 
    var file = $("input[type=file]")[0].files[0]; 
    alert(file.name + "\n" + 
      file.type + "\n" + 
      file.size + "\n" + 
      file.lastModifiedDate); 
}); 

Można również wyświetlić podgląd wybranego pliku za pomocą FileReader.

<div id="preview"></div> 

displayAsImage3(file, "preview"); 

function displayAsImage3(file, containerid) { 
    if (typeof FileReader !== "undefined") { 
     var container = document.getElementById(containerid), 
      img = document.createElement("img"), 
      reader; 
     container.appendChild(img); 
     reader = new FileReader(); 
     reader.onload = (function (theImg) { 
      return function (evt) { 
       theImg.src = evt.target.result; 
      }; 
     }(img)); 
     reader.readAsDataURL(file); 
    } 
} 

Tu pracuje jsFiddle