Функция обратного вызова после всплывающей подсказки /popover создается с помощью twitter bootstrap? - программирование
Подтвердить что ты не робот

Функция обратного вызова после всплывающей подсказки /popover создается с помощью twitter bootstrap?

Я хочу манипулировать всплывающей подсказкой или popover после ее создания с помощью twitter bootstrap. Насколько я знаю, нет возможности построить это.

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

Например, скажем, я хочу переместить созданную всплывающую подсказку вверх 5px и оставить 5px из нее вычисленного местоположения. Любые идеи о том, как это сделать?

Это то, что я хотел бы сделать:

$('#selector').popover({
  placement: 'bottom',
  callback: function(){
    alert('Awesome');
  }
});
4b9b3361

Ответ 1

Работает для всплывающей подсказки:

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

Ответ 2

Возможно, это было недоступно, когда были получены предыдущие ответы, но с 2016 года вы можете присоединить события к popovers (функционально эквивалентным обратному вызову).

например,

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

События включают:

  • show.bs.popover
  • shown.bs.popover
  • hide.bs.popover
  • hidden.bs.popover
  • inserted.bs.popover

Ref загрузочные документы

Ответ 3

Этот ответ был опубликован только для уточнения вещей по запросу Crafter и содержит код из комментария Маркеса.

Сначала вы добавляете "Bootstrap popover" для обработки опции callback.

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

Затем вы добавляете свойство callback к объекту объекта и назначаете его анонимной функцией.

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

Ответ 4

Другое обходное решение:

  • Используйте прослушиватели show.bs.popover или shows.bs.popover
  • В обратном вызове данные "показаны" события привязаны к цели, которая содержит идентификатор popover, отсюда вы могли бы сделать остальные

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

Функция обратного вызова:

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