Voir l'image sélectionnée du système de fichiers sur le côté client avant le téléchargement?

J'ai une balise d'entrée sur un formulaire de sélection des images à télécharger.

<div id="lowresDemo">
    <img src="some-url" />
</div>
<input type="file" id="FileToUpload" name="FileToUpload" />

J'ai essayé de changer les vignettes affichées sur le formulaire à côté de l'entrée de l'affirmer à l'utilisateur que sa sélection a été prévu avec le suivant jquery code:

$('#FileToUpload').change(function () {
    $('#lowresDemo img').attr('src', $(this).val());
});

...cela ne fonctionne pas dans n'importe quel navigateur, un navigateur pour des raisons de sécurité je beleieve (comme je me souviens de la dernière fois j'ai fait quelque chose comme il y a des années).

QUESTION:
Est-il un moyen de présenter à l'utilisateur le choix de l'image avant de soumettre le formulaire, et pas seulement le chemin+nom de la valeur dans le champ de saisie, mais une vignette montrant le fichier qu'ils ont choisi?

Ou n'navigateur moderne de sécurité pour éviter cela?

source d'informationauteur Faust

  1. 39

    C'est possible avec le Fichier API (IE ne prend pas en charge le Fichier API)

    <input type="file">
<script type="text/javascript">
    $(document).ready(function() {
    $("input").change(function(e) {

    for (var i = 0; i < e.originalEvent.srcElement.files.length; i++) {
        var file = e.originalEvent.srcElement.files[i];

        var img = document.createElement("img");
        var reader = new FileReader();
        reader.onloadend = function() {
            img.src = reader.result;
        }
        reader.readAsDataURL(file);
        $("input").after(img);
    }
});
    });
</script>

    De travail exemple: http://jsfiddle.net/ugPDx/

  2. 1

    Il n'existe aucun moyen pour effectuer l'opération avant de télécharger l'image.

    Mais penser d'une manière différente - l'utilisateur "n'est "soins" si l'image est déjà téléchargé - vous pouvez afficher la vignette d'après les avoir téléchargés, et montrer de la confirmation de la case. Gmail le fait avec leurs pièces jointes - dès que vous avez sélectionné le fichier à joindre, le téléchargement commence. Mais l'utilisateur a toujours la possibilité de décocher le fichier, et il ne sera pas inclus dans le courriel.