Comment continuer la propagation de l'évènement après l'annulation?

J'ai résolu le problème par la voie de l'un de mes projets. Cet exemple fonctionne avec certains de base de la gestion d'événements, comme les clics etc. Gestionnaire de confirmation doit être le premier gestionnaire d'lié.

    //This example assumes clickFunction is first event handled.
    //
    //you have to preserve called function handler to ignore it 
    //when you continue calling.
    //
    //store it in object to preserve function reference     
    var ignoredHandler = {
        fn: false
    };

    //function which will continues processing        
    var go = function(e, el){
        //process href
        var href = $(el).attr('href');
        if (href) {
             window.location = href;
        }

        //process events
        var events = $(el).data('events');

        for (prop in events) {
            if (events.hasOwnProperty(prop)) {
                var event = events[prop];
                $.each(event, function(idx, handler){
                    //do not run for clickFunction
                    if (ignoredHandler.fn != handler.handler) {
                        handler.handler.call(el, e);
                    }
                });
            }
        }
    }

    //click handler
    var clickFunction = function(e){
        e.preventDefault();
        e.stopImmediatePropagation();
        MyApp.confirm("Are you sure you want to navigate away?")
           .done(go.apply(this, e));
    };

    //preserve ignored handler
    ignoredHandler.fn = clickFunction;
    $('.confirmable').click(clickFunction);

    //a little bit longer but it works :)

J'ai résolu ce problème par:

1. placer un écouteur d'événement sur un élément parent
2. retrait de la classe à partir du lien UNIQUEMENT lorsque l'utilisateur confirme
3. reclicking le lien après, j'ai enlevé la classe.

JS:

function async() {
  var dfd = $.Deferred();
  
  //simulate async
  setTimeout(function () {
    if (confirm('Stackoverflow FTW')) {
      dfd.resolve();
    } else {
      dfd.reject();
    }
  }, 0);
  
  return dfd.promise();
};

$('.container').on('click', '.another-page', function (e) {
  e.stopPropagation();
  e.preventDefault();
  async().done(function () {
    $(e.currentTarget).removeClass('another-page').click();
  });
});

$('body').on('click', function (e) {
  alert('navigating somewhere else woot!')
});

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container">
  <a href="#" class="another-page">Somewhere else</a>
</div>

La raison que j'ai ajouté l'écouteur d'événement pour le parent et non pas le lien lui-même est parce que le jQuery on événement vont se lier à l'élément jusqu'à ce que dit le contraire. Ainsi, même si l'élément n'a pas la classe another-page il a encore de l'écouteur d'événement attaché ainsi, vous devez prendre avantage de event delegation pour résoudre ce problème.

PIÈGES c'est très état. c'est à dire si vous avez besoin de demander à l'utilisateur CHAQUE fois qu'ils cliquent sur un lien, vous aurez à ajouter un 2ème auditeur à readd la another-page retour en classe sur le lien. c'est à dire:

$('body').on('click', function (e) {
  $(e.currentTarget).addClass('another-page');
});

note de côté vous pouvez également supprimer l'écouteur d'événement sur container si l'utilisateur accepte, si vous faites cela, assurez-vous d'utiliser namespace événements, car il pourrait y avoir d'autres auditeurs sur le conteneur, vous pourriez involontairement supprimer. voir https://api.jquery.com/event.namespace/ pour plus de détails.

J'ai édité votre code. De nouvelles fonctionnalités que j'ai ajouté:

1. Ajoutée de l'espace de noms de l'événement;
2. Après cliquez sur l'élément de l'événement seront supprimées par l'espace de noms;
3. Enfin, après avoir terminé les actions nécessaires dans "MyApp" continuer de la section multiplication par le déclenchement d'autres élément ", cliquez sur" événements.

Code:

$('a.my-link').on("click.myEvent", function(e) {
  var $that = $(this);
  $that.off("click.myEvent");
  e.preventDefault();
  e.stopImmediatePropagation();
  MyApp.confirm("Are you sure you want to navigate away?")
    .done(function() {
        //continue propogation of e
        $that.trigger("click");
    });
});