Comment poursuivre la propagation des événements après une annulation ?

Question

Lorsqu'un utilisateur clique sur un certain lien, j'aimerais lui présenter une boîte de dialogue de confirmation. S'il clique sur "Oui", j'aimerais poursuivre la navigation initiale. Un hic : mon dialogue de confirmation est mis en œuvre en renvoyant un objet jQuery.Deferred qui n'est résolu que si l'utilisateur clique sur le bouton "Oui". Le dialogue de confirmation est donc asynchrone.

En gros, je veux quelque chose comme ça :

$('a.my-link').click(function(e) {
  e.preventDefault(); e.stopPropogation();
  MyApp.confirm("Are you sure you want to navigate away?")
    .done(function() {
      //continue propogation of e
    })
})

Bien sûr, je pourrais placer un drapeau et redéclencher le clic, mais c'est très compliqué. Y a-t-il un moyen naturel de faire cela ?

Answer 1

Nous avons un besoin similaire dans notre projet et cela fonctionne pour moi. Testé dans chrome et IE11.

$('a.my-link').click(function(e) {
  e.preventDefault(); 
  if (do_something === true) {
    e.stopPropogation();
    MyApp.confirm("Are you sure you want to navigate away?")
    .done(function() {
      do_something = false;
      // this allows user to navigate 
      $(e.target).click();
    })
  }

})

Answer 2

J'ai modifié votre code. Nouvelles fonctionnalités que j'ai ajoutées :

1. Ajout d'un espace de noms à l'événement ;
2. Après avoir cliqué sur un élément, l'événement sera supprimé par l'espace de noms ;
3. Enfin, après avoir terminé les actions nécessaires dans la section "MyApp", la propagation se poursuit en déclenchant les événements de "clic" d'autres éléments.

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");
    });
});

Answer 3

Cette solution n'a pas été testée mais elle pourrait vous permettre de contourner le problème.

$('a.my-link').click(function(e) {
  e.preventDefault(); e.stopPropogation();
  MyApp.confirm("Are you sure you want to navigate away?")
    .done(function() {
      //continue propogation of e
      $(this).unbind('click').click()
  })
})