jquery ui工具提示手动打开/close
jquery ui工具提示手动打开/close
提问于 2012-10-25 04:56:23
有没有办法手动打开关闭jquery ui工具提示？我只想让它对打开/关闭的单击事件做出反应。你可以解除所有鼠标事件的绑定，当调用.tooltip('open')时，它会重新绑定它们，即使这不应该初始化或设置事件，因为如果你不初始化就运行.tooltip('open')，它会大声抱怨没有初始化。
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-10-24 23:35:40
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 });Stack Overflow用户
发布于 2012-10-25 12:04:45
工具提示有一个禁用选项。我用了它，下面是代码：
$('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');
});Stack Overflow用户
发布于 2018-04-06 05:53:44
一些来自其他SO问题的汇编。
Example在单击hint时显示工具提示，并在单击时隐藏工具提示
$(document).on('click', '.hint', function(){ //init new tooltip on click
$(this).tooltip({
position: { my: 'left+15 center', at: 'center right' },
show: false,
hide: false
}).tooltip('open'); // show new tooltip
}).on('click', function(event){ // click everywhere
if(!$(event.target).hasClass('hint'))
$(".hint").each(function(){
var $element = $(this);
if($element.data('ui-tooltip')) { // remove tooltip only from initialized elements
$element.tooltip('destroy');
}
})
});
$('.hint').on('mouseout focusout', function(event) { // prevent auto hide tooltip
event.stopImmediatePropagation();
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13057606
复制相关文章
相似问题