JQuery для мобильных устройств для последующей загрузки

Я создаю небольшое мобильное веб-приложение, используя JQuery Mobile. Теперь я хочу выбрать изображение на телефоне и получить информацию об этом, чтобы загрузить его позже из приложения. Возможно ли это?

Я могу быть в автономном режиме и все равно могу выбрать изображение, которое хочу загрузить.

Ответы

Ответ 1

Если ваш целевой браузер телефона поддерживает тип ввода файла загрузки и FileAPI (например, iOS 6.0 Safari)

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

то вы можете позволить своему пользователю выбрать существующий файл или даже использовать камеру для съемки, а также прочитать некоторые атрибуты файла изображения (имя файла, размер, тип, дату изменения).

$("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);
});

Вы также можете сделать предварительный просмотр выбранного файла с помощью 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);
    }
}

Здесь работает jsFiddle