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
689 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!

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
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