Javascript Girl
  1. Javascript Girl
  3. Retard après avoir cliqué sur le bouton de chargement de fichier?
Intereting Posts
Comment obtenir les références de toutes les fenêtres enfant déjà ouvertes Comment enregistrer la toile svg dans le système de fichiers local Comment implémenter un événement de presse longue avec Polymer1.0? Défilement vers un élément dans un div AngularJS définissant angular.module () plusieurs fois Garder une page Web centrée lorsque la barre de défilement du navigateur apparaît et disparaît Valeur de retour Asynchrone Javascript Est-il préférable d'envelopper le code dans une déclaration «IF», ​​ou est-il préférable de «court-circuiter» la fonction et le retour? Est-il considéré comme une bonne pratique de passer callBacks à redux d'action asynchrone? Jquery valide la position d'erreur Emballage de classes ES6 avec Webpack. Existe-t-il un moyen d'hisser les cours étendus? Date d'analyse sans fuseau horaire javascript Comment puis-je changer une image en utilisant CamanJS? Impossible de charger des images Comment simuler le vol stationnement avec Javascript sur la déviation?

Retard après avoir cliqué sur le bouton de chargement de fichier?

Lorsque je clique sur "Sélectionner le fichier à télécharger" (c'est-à-dire type d'entrée = fichier), il y a un délai entre le moment où j'ai cliqué sur le bouton et sélectionné le fichier pour afficher le fichier sélectionné à côté du bouton. Le navigateur tente-t-il de charger le fichier dans le navigateur? Pourquoi y at-il un délai.

Pour cela, comment puis-je afficher un message "Veuillez patienter …" immédiatement après avoir sélectionné le fichier. J'ai expérimenté avec diverses options JQ tout semble déclencher après le délai initial (comme je l'ai dit, peut-être que le navigateur tente de charger le fichier pas sûr) Je veux couvrir le délai avec le widget / message du chargeur.

Aidez-nous.

L'approche consiste à utiliser le button sur l'élément pour déclencher le click sur input type="file" dialogue input type="file" pour Open File ; Ajoute le widget "Chargement" au document; .one() pour attacher l'événement de focus au focus sur $(window) pour supprimer le widget "Chargement" lorsque la window réinitialise après la sélection par l'utilisateur du fichier ou la fermeture de la boîte de dialogue Open File . 

 $("button").click(function() { var spinner = $("<img />", { "id": "spinner", "src": "data:image/gif;charset=binary;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQACgABACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkEAAoAAgAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkEAAoAAwAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkEAAoABAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQACgAFACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQACgAGACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAAKAAcALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==" }); $(this).after(spinner).nextAll("input:first").click(); $(window).one("focus", function() { $("#spinner").detach() }) }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <button>choose file</button> <input type="file" style="opacity:0;"/>

J'ai combiné l'approche de guest271314 avec une autre méthode pour obtenir les résultats. Je peux dire que je n'aurais pas été capable d'aller jusqu'à cette aide. Sur la charge sur l'image, détient le chargeur jusqu'à ce que l'image soit complètement chargée.

La méthode est 

 enter code here $('#preview').bind("DOMSubtreeModified",function(){ $('#preview').find('img') .on('load', function() { $.mobile.loading('hide'); }); });

C'est ce que je dois travailler: HTML: 

 <input class="fileUploadBtn" name="image" type="file"/>

Javascript / Jquery: 

 $(".fileUploadBtn").click(function() { //Your code here to show please wait $('input[type=file]').change(function(e){ // Your code here to hide please wait });