


Explication détaillée du téléchargement de fichiers à l'aide de jQuery Ajax
本文主要介绍了jQuery Ajax方式上传文件的方法的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下,希望能帮助到大家。
jQuery Ajax方式上传文件用到两个对象
第一个对象:FormData
第二个对象:XMLHttpRequest
目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 FormData 对象,还在用IE6 ? 只能仰天长叹....
有了这两个对象,我们可以真正的实现Ajax方式上传文件。
示例代码:
<!DOCTYPE html> <html> <head> <title>Html5 Ajax 上传文件</title> <script type="text/javascript"> function UpladFile() { var fileObj = document.getElementByIdx_x_x("file").files[0]; // 获取文件对象 var FileController = "../file/save"; // 接收上传文件的后台地址 // FormData 对象 var form = new FormData(); form.append("author", "hooyes"); // 可以增加表单数据 form.append("file", fileObj); // 文件对象 // XMLHttpRequest 对象 var xhr = new XMLHttpRequest(); xhr.open("post", FileController, true); xhr.onload = function () { alert("上传完成!"); }; xhr.send(form); } </script> </head> <body> <input type="file" id="file" name="myfile" /> <input type="button" onclick="UpladFile()" value="上传" /> </body> </html>
很简洁的代码,便可以达到Ajax方式上传文件,上面的代码中使用这种传统的选择文件的方法产生文件对象,HTML5还支持使用多种更灵活的方式,如拖拽文件到指定的元素上产生。
Ajax已成功上传文件,但这时我们会想到一个问题,如何显示进度条?带着这个问题,脑子会想到,Flash? 浏览器插件?。
NO,现在不需要这些东西了。
开始着手,先做一个进度条,进度条也很简单,使用HTML5 新加的标签:
<progress id="progressBar" value="0" max="100"> </progress>
这个在浏览器中便会呈现了一个进度条,现在我们要做的就是在上传的时候,实时的去改变它的Value值,然后进度显示的问题便交给它了。
我们的服务器端无需修改,只需要在JS中XHR对象加一个事件。
xhr.upload.addEventListener("progress", progressFunction, false)
progressFunction 被调用的时候会传进一个事件对象,这个对象有两个属性,一个就是loaded 一个是total ,分别代表,已上传的值,和总要上传的值。
这正是我们需要的,所以这个方法,可以这样写:
function progressFunction(evt) { var progressBar = document.getElementByIdx_x_x("progressBar"); if (evt.lengthComputable) { progressBar.max = evt.total; progressBar.value = evt.loaded; } }
这样便可以完成,上传进度显示了。
如下针对上面的第一个示例代码,做一个调整:
示例代码2,带进度显示:
Html5 Ajax 上传文件
后台接收文件的程序可以是任何语言(C#,PHP,Python 等)编写的,上述例子使用C#
很简单,无需为这个进度条做任何改动。
var flist = Request.Files; for (int i = 0; i < flist.Count; i++) { string FilePath = "E:\\hooyes\\Files\\"; var c = flist[i]; FilePath = Path.Combine(FilePath, c.FileName); c.SaveAs(FilePath); }
相关推荐:
jQuery Form实现Ajax上传文件同时设置headers详解
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

AI Hentai Generator
Générez AI Hentai gratuitement.

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Lors de la suppression ou de la décompression d'un dossier sur votre ordinateur, une boîte de dialogue d'invite « Erreur 0x80004005 : erreur non spécifiée » apparaît parfois. Comment devez-vous résoudre cette situation ? Il existe en fait de nombreuses raisons pour lesquelles le code d'erreur 0x80004005 est demandé, mais la plupart d'entre elles sont causées par des virus. Nous pouvons réenregistrer la DLL pour résoudre le problème. Ci-dessous, l'éditeur vous expliquera l'expérience de gestion du code d'erreur 0x80004005. . Certains utilisateurs reçoivent le code d'erreur 0X80004005 lors de l'utilisation de leur ordinateur. L'erreur 0x80004005 est principalement due au fait que l'ordinateur n'enregistre pas correctement certains fichiers de bibliothèque de liens dynamiques ou à un pare-feu qui n'autorise pas les connexions HTTPS entre l'ordinateur et Internet. Alors que diriez-vous

Quark Netdisk et Baidu Netdisk sont actuellement les logiciels Netdisk les plus couramment utilisés pour stocker des fichiers. Si vous souhaitez enregistrer les fichiers de Quark Netdisk sur Baidu Netdisk, comment procéder ? Dans ce numéro, l'éditeur a compilé les étapes du didacticiel pour transférer des fichiers d'un ordinateur Quark Network Disk vers Baidu Network Disk. Voyons comment le faire fonctionner. Comment enregistrer les fichiers du disque réseau Quark sur le disque réseau Baidu ? Pour transférer des fichiers de Quark Network Disk vers Baidu Network Disk, vous devez d'abord télécharger les fichiers requis depuis Quark Network Disk, puis sélectionner le dossier cible dans le client Baidu Network Disk et l'ouvrir. Ensuite, faites glisser et déposez les fichiers téléchargés depuis Quark Cloud Disk dans le dossier ouvert par le client Baidu Cloud Disk, ou utilisez la fonction de téléchargement pour ajouter les fichiers sur Baidu Cloud Disk. Assurez-vous de vérifier si le fichier a été transféré avec succès dans Baidu Cloud Disk une fois le téléchargement terminé. C'est ça

Récemment, de nombreux internautes ont demandé à l'éditeur : quel est le fichier hiberfil.sys ? hiberfil.sys peut-il occuper beaucoup d’espace sur le disque C et être supprimé ? L'éditeur peut vous indiquer que le fichier hiberfil.sys peut être supprimé. Jetons un coup d'œil aux détails ci-dessous. hiberfil.sys est un fichier caché dans le système Windows et également un fichier d'hibernation du système. Il est généralement stocké dans le répertoire racine du lecteur C et sa taille est équivalente à la taille de la mémoire installée du système. Ce fichier est utilisé lorsque l'ordinateur est en veille prolongée et contient les données de mémoire du système actuel afin qu'il puisse être rapidement restauré à son état précédent lors de la récupération. Étant donné que sa taille est égale à la capacité de la mémoire, il peut occuper une plus grande quantité d’espace sur le disque dur. hiberner

Explication détaillée du rôle des fichiers .ibd dans MySQL et précautions associées MySQL est un système de gestion de base de données relationnelle populaire, et les données de la base de données sont stockées dans différents fichiers. Parmi eux, le fichier .ibd est un fichier de données du moteur de stockage InnoDB, utilisé pour stocker des données et des index dans des tables. Cet article fournira une analyse détaillée du rôle du fichier .ibd dans MySQL et fournira des exemples de code pertinents pour aider les lecteurs à mieux comprendre. 1. Le rôle des fichiers .ibd : stockage des données : les fichiers .ibd sont du stockage InnoDB

Sur les systèmes Linux, vous pouvez utiliser la commande suivante pour afficher le contenu du fichier journal : Commande tail : La commande tail est utilisée pour afficher le contenu à la fin du fichier journal. Il s'agit d'une commande courante pour afficher les dernières informations du journal. tail [option] [nom du fichier] Les options couramment utilisées incluent : -n : Spécifiez le nombre de lignes à afficher, la valeur par défaut est de 10 lignes. -f : Surveillez le contenu du fichier en temps réel et affichez automatiquement le nouveau contenu lorsque le fichier est mis à jour. Exemple : tail-n20logfile.txt#Afficher les 20 dernières lignes du fichier logfile.txt tail-flogfile.txt#Surveiller le contenu mis à jour du fichier logfile.txt en temps réel Commande head : La commande head permet d'afficher le début du fichier journal

Travailler avec des fichiers dans le système d'exploitation Linux nécessite l'utilisation de diverses commandes et techniques qui permettent aux développeurs de créer et d'exécuter efficacement des fichiers, du code, des programmes, des scripts et d'autres éléments. Dans l'environnement Linux, les fichiers portant l'extension « .a » sont d'une grande importance en tant que bibliothèques statiques. Ces bibliothèques jouent un rôle important dans le développement de logiciels, permettant aux développeurs de gérer et de partager efficacement des fonctionnalités communes sur plusieurs programmes. Pour un développement logiciel efficace dans un environnement Linux, il est crucial de comprendre comment créer et exécuter des fichiers « .a ». Cet article explique comment installer et configurer de manière complète le fichier Linux « .a ». Explorons la définition, l'objectif, la structure et les méthodes de création et d'exécution du fichier Linux « .a ». Qu'est-ce que L

Créez un moteur de suggestions de saisie semi-automatique en utilisant PHP et Ajax : Script côté serveur : gère les requêtes Ajax et renvoie des suggestions (autocomplete.php). Script client : envoyer une requête Ajax et afficher des suggestions (autocomplete.js). Cas pratique : Incluez le script dans la page HTML et spécifiez l'identifiant de l'élément d'entrée de recherche.

L'utilisation d'Ajax pour obtenir des variables à partir de méthodes PHP est un scénario courant dans le développement Web. Grâce à Ajax, la page peut être obtenue dynamiquement sans actualiser les données. Dans cet article, nous présenterons comment utiliser Ajax pour obtenir des variables à partir de méthodes PHP et fournirons des exemples de code spécifiques. Tout d’abord, nous devons écrire un fichier PHP pour gérer la requête Ajax et renvoyer les variables requises. Voici un exemple de code pour un simple fichier PHP getData.php :
