Maison > interface Web > js tutoriel > Javascript combiné avec fileReader pour télécharger des compétences pictures_javascript

Javascript combiné avec fileReader pour télécharger des compétences pictures_javascript

WBOY
Libérer: 2016-05-16 16:16:50
original
1367 Les gens l'ont consulté

L'API File ne sera pas expliquée en détail ici. Mes amis, vous pouvez le faire vous-même. Nous allons maintenant utiliser le handle de fichier pour lire le contenu du fichier. Grâce à l'interface FileReader, nous pouvons charger de manière asynchrone. le contenu du fichier en mémoire et attribuez-le à une variable js.

Copier le code Le code est le suivant :

function getImgSrc (cible, rappel) {
Si (window.FileReader) {
      var oPreviewImg = null, oFReader = new window.FileReader();
oFReader.onload = fonction (oFREvent) {
oPreviewImg = nouvelle Image();
              var type = target.files[0].type.split("/")[1];
          var src = oFREvent.target.result;
oPreviewImg.src = src;
Si (type de rappel == "fonction") {
                   rappel (oPreviewImg, target, type, src);
            }
               return oPreviewImg.src;
        };
         retour (fonction () {
            var aFiles = target.files;
                  if (aFiles.length === 0) {
                  revenir ;
            }
Si (!IsImgType(aFiles[0].type)) {
alert("Vous devez sélectionner un fichier image valide!");
                  revenir ;
            }
Si (aFiles[0].size > 1024 * 1024) {
                   target.value = "";
alert('Veuillez télécharger une taille de fichier image inférieure à 1 Mo.');
                  revenir ;
            }
            oFReader.readAsDataURL(aFiles[0]);
         })();
>
Si (navigator.appName === "Microsoft Internet Explorer") {
         retour (fonction () {
document.getElementById("imagePreview").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = target.value;
         })();
>
>

Ce qui précède est le code clé pour télécharger des images en utilisant javascript combiné avec fileReader. Vous l'aimez ?

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal