JQuery ui tooltip manual open/close

Есть ли способ вручную открыть закрытие jQuery ui tooltip? Я просто хочу, чтобы он реагировал на включение/выключение события click. Вы можете отпереть все события мыши, и они будут переназначать их при вызове .tooltip('open'), хотя это не должно инициализировать или устанавливать события imo, так как если вы попытаетесь запустить .tooltip('open') без инициализации, он жалуется громко о не инициализироваться.

Ответ 1

jltwoo, могу ли я предложить использовать два разных логических переключателя для автоматического открытия и автоматического закрытия? С этим изменением ваш код будет выглядеть так:

(function( $ ) {
  $.widget( "custom.tooltipX", $.ui.tooltip, {
    options: {
        autoShow: true,
        autoHide: true
    },

    _create: function() {
      this._super();
      if(!this.options.autoShow){
        this._off(this.element, "mouseover focusin");
      }
    },

    _open: function( event, target, content ) {
      this._superApply(arguments);

      if(!this.options.autoHide){
        this._off(target, "mouseleave focusout");
      }
    }
  });

}( jQuery ) );

Таким образом, инициализация всплывающей подсказки как:

$(someDOM).tooltipX({ autoHide:false });

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

Если вы хотите вручную управлять открытыми и закрытыми действиями, вы можете просто использовать:

$(someDOM).tooltipX({ autoShow:false, autoHide:false });

Ответ 2

Если вы хотите просто отпереть события и не хотите создавать свою собственную подсказку.

$("#some-id").tooltip(tooltip_settings)
             .on('mouseout focusout', function(event) {
                  event.stopImmediatePropagation();
             });

$("#some-id").attr("title", "Message");
$("#some-id").tooltip("open");

mouseout блокирует исчезновение инструментальной панели путем перемещения курсора мыши

focusout блокирует исчезновение панели инструментов с помощью навигации по клавиатуре

Ответ 3

В подсказке есть опция отключения. Ну, я использовал его и вот код:

$('a').tooltip({
    disabled: true    
}).click(function(){    
    if($(this).tooltip('option', 'disabled'))
        $(this).tooltip('option', {disabled: false}).tooltip('open');
    else
        $(this).tooltip('option', {disabled: true}).tooltip('close');
}).hover(function(){
    $(this).tooltip('option', {disabled: true}).tooltip('close');
}, function(){
    $(this).tooltip('option', {disabled: true}).tooltip('close');
});

Ответ 4

В связи с моим другим комментарием, я просмотрел исходный код и получил ручное открытие/закрытие, расширив виджет и добавив параметр autoHide с версией JQuery-UI v1.10.3. В основном я просто удаляю слушателей мыши, которые были добавлены в _create и внутренний вызов _open.

Изменить: Разделенные autHide и autoShow как два отдельных флага, как предлагается @MscG

Демо здесь: http://jsfiddle.net/BfSz3/

(function( $ ) {
  $.widget( "custom.tooltipX", $.ui.tooltip, {
    options: {
      autoHide:true,
      autoShow: true
    },

    _create: function() {
      this._super();
      if(!this.options.autoShow){
        this._off(this.element, "mouseover focusin");
      }
    },

    _open: function( event, target, content ) {
      this._superApply(arguments);

      if(!this.options.autoHide){
        this._off(target, "mouseleave focusout");
      }
    }
  });

}( jQuery ) );

Теперь, когда вы инициализируетесь, вы можете установить всплывающую подсказку, чтобы вручную показать или скрыть, установив autoHide: false:

 $(someDOM).tooltipX({ autoHide:false });

И просто непосредственно выполняйте стандартные вызовы open/close в вашем коде по мере необходимости в другом месте

 $(someDOM).tooltipX("open"); // displays tooltip
 $(someDOM).tooltipX("close"); // closes tooltip

Простое исправление, до тех пор, пока у меня не будет времени сделать официальный запрос на pull, это нужно будет сделать.