Tout d’abord, je tiens à préciser qu’il s’agit d’une encapsulation secondaire du contrôle de téléchargement open source de WebUploader, et que la couche sous-jacente est toujours implémentée par WebUploader, juste pour l’utiliser plus concisement.
Jetons un œil à WebUploader
Introduction:
WebUploader est un composant moderne simple basé sur HTML5 pour l’envoi de fichiers, développé par l’équipe Baidu WebFE (FEX). Dans les navigateurs modernes, il peut exploiter pleinement les avantages de HTML5, sans abandonner le navigateur IE grand public, utilisant l’exécution FLASH originale, compatible avec IE6+, iOS 6+ et Android 4+. La même méthode d’appel peut être utilisée par les utilisateurs à tout moment lorsque les deux ensembles d’exécutions sont disponibles.
L’utilisation de gros fragments de fichiers et de téléversement simultané améliore considérablement l’efficacité du téléchargement de fichiers.
Adresse officielle du site web : http://fex.baidu.com/webuploader/
Si vous souhaitez jouer seul, vous pouvez aller directement sur le site officiel
Commençons le texte :
D’après ce qui précède, on peut voir que la fonction WebUploader de Baidu est effectivement très puissante, mais comme tous les contrôles d’upload, elle est plus encombrante à utiliser, comme suit :
Il faut d’abord consulter plusieurs bibliothèques connexes,
Ensuite, écrivez bien le HTML
Nous ne voulons pas tout ça !, juste deux phrases, obtenez notre upload. Voici :
J’ai écrit que le style bootstrap css fera automatiquement référence à,
Prendre en charge le téléchargement de fichiers multiples,
Identifier automatiquement les fichiers en double (Identifier les fichiers en double),
Téléversement automatique optionnel et téléchargement manuel,
Vous pouvez afficher plusieurs contrôles d’envoi sur une page sans conflit
Ensuite, certains paramètres de configuration liés à WebUploader peuvent être configurés vous-même.
Allons directement au widget JS que j’ai emballé (un peu désordonné, faisons avec) :
Certains paramètres liés et plus importants ont été rédigés avec des notes, et vous pouvez vous y référer vous-même.
Alors utilisons-le.
Écrivez notre JS et HTML comme suit :
Ce n’est pas grave, ça vaut la peine de le noter
Pour les paramètres dans powerWebUpload, veuillez vous référer à l’API sur le site officiel
La méthode GetFilesAddress() renverra un tableau de chemins de fichiers après le téléchargement, et vous pouvez l’obtenir vous-même.
Enfin, la dernière démo que j’ai écrite, implémentée avec Asp.net MVC, vous pouvez la télécharger vous-même :
Baidu Netdisk :
Lien : http://pan.baidu.com/s/1o8B0xOQ Mot de passe : 9kws
Original : http://www.cnblogs.com/GuZhenYin/p/5584272.html
|
Publié sur 27/06/2016 15:13:30
|
|
|
|
Publié sur 04/05/2020 21:03:04