Google Chrome téléchargement du fichier bug: sur le changement de l'événement ne sera pas exécutée deux fois avec le même fichier

Je suis en train de travailler sur ce fichier html5 uploader plugin, mais il a un bug sur Google Chrome qui je ne peux pas le comprendre et de le corriger. Il fonctionne très bien sur Firefox.

jsfiddle lien

Le problème, c'est que vous ne peut pas télécharger le même fichier deux fois à partir de votre bureau.

Lorsque vous cliquez sur, sélectionnez et appuyez sur OK pour télécharger un fichier à partir de votre bureau, il doit alerter un message, par exemple".bouton-1' - dépend sur le bouton de téléchargement vous cliquez sur.

Ensuite, si vous essayez de télécharger le même fichier de nouveau, cette ligne de code ne sera pas exécuté plus,

$(".upload-file",object_parent).change(function() {

             ...
             ...

             alert($cm.selector);

});

Une idée de ce qui va mal dans ce plugin?

(function($){

    //Attach this new method to jQuery
    $.fn.extend({ 

        //This is where you write your plugin's name
        upload_file_html5: function(options) {

            //Set the default values, use comma to separate the settings, example:
            var defaults = {
                objectSuperparent:    '.media'
            }

            var options =  $.extend(defaults, options);
            var o = options;

            var $cm = this.click(function(e){

                //<a> button is the object in this case.
                var object = $(this);

                //Get other info from the element belong to this object group.
                var object_href = object.attr('href');
                var object_parent = object.parent();
                alert($cm.selector);

                //Trigger the click event on the element.
                //Due to security policies triggering click on the input type=file is not allowed/supported in some browsers and Opera is one of them.
                //$('input[type=file]').trigger('click'); //or:
                $(".upload-file",object_parent).click();

                return false;

            });

            //Trigger ajax post when ever the file is changed by the user.
            var $cm_2 = $(".upload-file").change(function(){

                //<input> is the object in this case.
                var object = $(this);

                var object_form = object.parent();
                var object_superparent = object.parents(o.objectSuperparent);
                var path_config = $($cm.selector,object_superparent).attr('href');
                var path_post = object_form.attr('action');

                alert($cm.selector);
                //alert(path_config);

                ....
                ....

            });

        }
    });

})(jQuery);

Il a été fonctionne correctement sur Chrome, mais seulement échoué récemment, probablement Chrome a mis à jour la dernière version de ma machine et cette mise à jour provoque le bug?

InformationsquelleAutor laukok | 2012-02-06
  1. 16

    Oui. Mon Chrome a un comportement différent de Firefox, mais je pense que Chrome est correct.

    Selon W3C du document:

    événement onchange se produit lorsque le contrôle perd le focus d'entrée et sa valeur a été modifiée depuis l'accès à l'accent

    si vous essayez de télécharger le même fichier, la valeur de l'entrée de fichier ne change pas. Essayez de l'imprimer:

    $('.button-2').click(function(){
    console.log($(".list .upload-file").val())
    return false;
});
    • merci. Je ne devrais pas utiliser événement onchange alors? ou, en tout cas puis-je faire pour que je puisse télécharger le même fichier? merci 🙂
    • voir @fundon du répondre ci-dessous pour une solution de travail
    InformationsquelleAutor Shellex Wai
  2. 46

    Si vous voulez télécharger deux fois, effacer le fichier d'entrée valeur

    $('input[type="file"]').val(null);

    jsfiddle test

    • Je voudrais supprimer le jsfiddle lien, le "objectSuperparent" et tout le code confond un peu.
    • merci mon ami, vous avez résolu mon problème
    • Merci, tirait mes cheveux au cours de cette!
    • Oui, cela fonctionne.
    InformationsquelleAutor fundon
  3. 2

    il se peut que l'entrée est en cours de re-rendus. Pour quelque raison que ce peut être, pour moi sa pertinence.
    L' $.on('change', callback) fonctionnalité est perdue.

    Essayez d'utiliser .fonction de délégué qui, je l'adore!
    http://api.jquery.com/delegate/

    Ok, donc délégué est exactement le même, il dit juste jquery si il y a un élément d'affichage à l'écran avec un particulier de la poignée, joindre une fonctionnalité à elle.

    Donc, même si l'élément est un nouveau rendu, il continuera à fonctionner.

    $(document).delegate('.file_upload_btn', 'change', function(){});

    Vous pouvez penser que c'est jeter de la fonction & dire quel est la différence, mais cela m'a sauvé beaucoup de temps sur des projets.

    InformationsquelleAutor A H Bensiali