Maison > interface Web > js tutoriel > PHP jQuery Ajax implémente plusieurs effets de téléchargement d'images_jquery

PHP jQuery Ajax implémente plusieurs effets de téléchargement d'images_jquery

WBOY
Libérer: 2016-05-16 16:09:30
original
1451 Les gens l'ont consulté

Ce que je vais partager avec vous aujourd'hui, c'est utiliser PHP jQuery Ajax pour obtenir l'effet de télécharger plusieurs images sans actualiser la page. L'utilisateur n'a qu'à cliquer pour sélectionner l'image à télécharger, puis l'image est automatiquement téléchargée sur le serveur et affichée sur la page.

HTML

Nous plaçons un formulaire sur la page et utilisons post pour le soumettre au gestionnaire php en arrière-plan upload.php. Notez que le paramètre de l'attribut enctype doit prendre en charge le téléchargement de fichiers. #preview est utilisé pour afficher l'image après le téléchargement. Il n'y a aucune explication dans cet article sur le paramètre de style CSS. Veuillez vous référer au code source du package de téléchargement.

Copier le code Le code est le suivant :

                                                                                                                                                                                                                              Ajouter une image           

Maximum 100 Ko, prend en charge les formats jpg, gif et png.




jQuery
Cet exemple est basé sur jQuery, donc la bibliothèque jquery et jquery.wallform.js doivent être chargés dans la page.




Copier le code


Le code est le suivant :


Copier le code

Le code est le suivant :

$(fonction(){

$('#photoimg').die('click').live('change', function(){

       var status = $("#up_status");       var btn = $("#up_btn");           $("#imageform").ajaxForm({ Cible : '#preview',               beforeSubmit:function(){ statut.show();                     btn.hide();
             },
                success:function(){
statut.hide();
                     btn.show();
             },
            erreur :fonction(){
statut.hide();
                     btn.show();
           } }).submit();
});
});

PHP

upload.php traite les téléchargements d'images et enregistre les images téléchargées dans le répertoire uploads/. Notez que le répertoire doit avoir des autorisations en écriture. Tout d'abord, vous devez vérifier si elle est soumise en mode POST, puis déterminer si le format et la taille de l'image répondent aux exigences, puis utiliser move_uploaded_file() pour télécharger l'image et renommer l'image au format : time().rand (100 999).

Copier le code Le code est le suivant :

$path = "téléchargements/"
$extArr = array("jpg", "png", "gif");
if(isset($_POST) et $_SERVER['REQUEST_METHOD'] == "POST"){
$nom = $_FILES['photoimg']['nom']; $size = $_FILES['photoimg']['size']; Si(vide($nom)){
echo 'Veuillez sélectionner l'image à télécharger';
sortir;
}
$ext = extend($nom);
Si(!in_array($ext,$extArr)){
echo 'Le format de l'image est incorrect ! ';
sortir;
}
Si($size>(100*1024)){
echo 'La taille de l'image ne peut pas dépasser 100 Ko';
sortir;
}
$image_name = time().rand(100,999).".".$ext
$tmp = $_FILES['photoimg']['tmp_name']
Si(move_uploaded_file($tmp, $path.$image_name)){
echo 'PHP jQuery Ajax implémente plusieurs effets de téléchargement d'images_jquery'
}autre{
echo 'Erreur de téléchargement ! ';
}
sortir;
}
//Obtenir le suffixe du type de fichier
function extend($file_name){
$extend = pathinfo($file_name);
$extend = strtolower($extend["extension"]);
Renvoie $étendre
}


Bien sûr, dans les applications réelles, il peut être combiné avec la base de données et le centre utilisateur pour enregistrer les images téléchargées par les utilisateurs dans le tableau de données. Vous pouvez étudier les applications spécifiques par vous-même.

Ce qui précède est tout le contenu partagé avec vous dans cet article, j'espère qu'il vous plaira.

É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