jquery UI 툴팁 수동 열기/닫기

Question

수동으로 jquery UI 툴팁을 닫을 수있는 방법이 있습니까? 난 단지 클릭 이벤트를 on/off 토글에 반응하기를 원한다. .tooltip ('open')을 호출하지 않으면 모든 마우스 이벤트를 바인딩 해제 할 수 있습니다. 초기화하지 않거나 이벤트를 설정하지 않아도됩니다. 초기화하지 않고 .tooltip ('open')을 실행하려고하면 불평합니다. 큰소리로 초기화되지 않는다.

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

Answer 2

툴팁에 사용 중지 옵션이 있습니다. 그럼 내가 여기에 그것을 사용하고 코드입니다 내 다른 의견에

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

Answer 3

관련, 나는 원래의 코드로 보았다/닫기 위젯을 확장하고 버전 JQuery와 - UI v1을 가진 자동 숨기기 옵션을 추가하여 수동 개방 달성 .10.3. 기본적으로 나는 _create 및 내부 _open 호출에 추가 된 마우스 리스너를 제거합니다.

편집 :

데모 여기 @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 }); 

그리고 공식 풀 요청을 할 수있는 시간이 될 때까지이해야 할 것, 다른 곳에서

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

간단한 핫픽스를 필요에 따라 바로 바로 코드의 표준 열기/닫기 호출을 수행합니다.

Answer 4

및 사용자 정의 툴팁을 좋아 woudn't : 수동 개폐 모두 동작을 제어하려면

, 당신은 간단하게 사용할 수 있습니다.

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

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

로 마우스를 차단 마우스 커서를

대한 focusOut 블록 키보드 탐색 내가 수동으로 열어야합니다