Maison > interface Web > js tutoriel > Comment vérifier la taille d'entrée du fichier avec jQuery ?

Comment vérifier la taille d'entrée du fichier avec jQuery ?

Mary-Kate Olsen
Libérer: 2024-11-04 08:27:02
original
749 Les gens l'ont consulté

How to Verify File Input Size with jQuery?

Comment vérifier la taille d'entrée du fichier à l'aide de jQuery

Problème :

Vous souhaitez implémenter le rapport d'erreurs côté client pour fichiers surdimensionnés dans un formulaire de téléchargement de fichiers à l'aide de jQuery. Vous vous demandez s'il est possible de vérifier la taille du fichier soit localement, soit en l'envoyant au serveur.

Réponse :

Bien que l'accès direct aux fichiers ne soit pas disponible pour JavaScript, l'API de fichier HTML5 expose diverses propriétés de fichier, y compris la taille du fichier.

Solution pour les navigateurs modernes (conforme HTML5) :

<code class="html"><input type="file" id="myFile" /></code>
Copier après la connexion
<code class="javascript">$('#myFile').bind('change', function() {
  alert(this.files[0].size); // Gets the file size in bytes
});</code>
Copier après la connexion

Prise en charge des navigateurs plus anciens :

Les navigateurs plus anciens peuvent ne pas prendre en charge l'API de fichiers. Vérifiez le support avant d'utiliser le code :

<code class="javascript">if (window.File && window.FileReader && window.FileList && window.Blob) {
  // File API support detected, continue with the solution above
} else {
  // Fallback handling for older browsers
  // (e.g., display an error message or implement custom file size validation)
}</code>
Copier après la connexion

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!

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal