Fonction de rappel après l'info-bulle / liste est créée avec twitter bootstrap?

Je veux manipuler une info-bulle ou de la liste après il est créé avec twitter bootstrap. Pour autant que je sache, il n'existe pas une façon de le faire.

$('#selector').popover({
  placement: 'bottom'
});

Par exemple permet de dire que je veux déplacer à la création de la bulle d'aide jusqu'5px et à gauche 5px il est calculé à partir de l'emplacement. Toutes les idées sur la meilleure façon de le faire?

C'est ce que j'aimerais faire:

$('#selector').popover({
  placement: 'bottom',
  callback: function(){
    alert('Awesome');
  }
});
InformationsquelleAutor Jose Browne | 2013-02-04
  1. 26

    Œuvres d'info-bulle:

    var tmp = $.fn.tooltip.Constructor.prototype.show;
$.fn.tooltip.Constructor.prototype.show = function () {
  tmp.call(this);
  if (this.options.callback) {
    this.options.callback();
  }
}

this.$('#selector').tooltip({ 
  placement: 'top', 
  callback: function() { 
    alert('hello') 
  } 
});
    • Peut paraître idiot, mais il n'était pas évident pour moi comment le faire fonctionner avec la liste. Pour ceux qui pourraient également exécuter dans ce petit défi, voici comment faire: var tmp = $.fn.liste.Constructeur.le prototype.spectacle; $.fn.liste.Constructeur.le prototype.show = function () { tmp.call(this); if (ce.des options.callback) { this.des options.callback(); } };
    • Personne ne sait qui de l'un des prototypes de méthodes pour annuler? github.com/twbs/bootstrap/blob/v2.3.2/js/bootstrap-tooltip.js
    • ajouter cette solution dans son propre réponse s'il vous plaît, de sorte qu'il peut être trouvé facilement, comme c'est la solution à la question.
    InformationsquelleAutor user20140268
  2. 12

    Peut-être que ce n'était pas disponible lors de la précédente réponses ont été données, mais à compter de 2016, vous pouvez associer des événements à popovers (fonctionnellement équivalent à un rappel).

    par exemple

    $('#myPopover').on('shown.bs.popover', function () {
  //do something…
})

    Les événements suivants:

    • spectacle.bs.liste
    • montré.bs.liste
    • cacher.bs.liste
    • caché.bs.liste
    • inséré.bs.liste

    Ref bootstrap docs

    • Meilleure réponse, car c'est maintenant une fonctionnalité fournie par Bootstrap lui-même!
    InformationsquelleAutor Michael Cho
  3. 5

    Cette réponse a été posté juste pour clarifier les choses, comme demandé par l'artisan et contient le code à partir de l'observation de Marquez.

    D'abord vous étendre Bootstrap de la liste de gérer un callback option.

    var tmp = $.fn.popover.Constructor.prototype.show;
$.fn.popover.Constructor.prototype.show = function() {
    tmp.call(this); if (this.options.callback) {
        this.options.callback();
    }
}

    Puis vous ajoutez un callback propriété à votre option de l'objet et de lui attribuer une fonction anonyme.

    $('#popover-foo').popover({
    content: 'Hello world',
    callback: function () {
        alert('Hello');
    }
});
    InformationsquelleAutor Fred
  4. 1

    Autre Solution:

    1. Utiliser le montrer.bs.liste ou montré.bs.liste des auditeurs

    2. Dans le rappel, le "montré" événement de liaisons de données à la cible, qui détient la liste d'ID, de là, vous pourrez faire le reste

      $('body')
.popover(options)
.on('shown.bs.popover', function(shownEvent) {
        update_popover_data(shownEvent);
});

    Fonction de rappel: 

        function update_popover_data(shownEvent) {
         var id = $(shownEvent.target).attr('aria-describedby');
         $('#'+id).html('Your New Popover Content');
    }
    InformationsquelleAutor Michiel