BOOTSTRAP提示多情况下不能正常工作

我使用的工具提示（），并打开multinstances如下尝试：BOOTSTRAP提示多情况下不能正常工作

$("*").tooltip({ 
    selector: "*[rel=tooltipTOP]", 
    placement: "top" 
    }); 
    $('*').tooltip({ 
    selector: "*[rel=tooltipBOTTOM]", 
    placement: "bottom" 
    });

然后在我的HTML例如做

<a rel="tooltipTOP" data-original-title="top">tooltip TOP</a> 
<a rel="tooltipBOTTOM" data-original-title="bottom">tooltip BOTTOM</a>

所以提示TOP是确定的，但tooltipBOTTOM不显示工具提示...为什么？

我tryed也将特定的类tooltipBOTTOM但它没有工作，它的实例只有tooltipTOP REL：/

的jsfiddle http://jsfiddle.net/BH2GM/1/

来源

2012-09-24 sbaaaang

首先，你为什么这样做基于rel ？你真的应该使用课堂。

<a class="tooltipTOP">tooltip TOP</a> 
<a class="tooltipBOTTOM">tooltip BOTTOM</a>

然后

$(".tooltipTOP").tooltip({ 
    placement: "top" 
}); 
$(".tooltipBOTTOM").tooltip({ 
    placement: "bottom" 
});

编辑：但是，如果你必须使用相对，这里的解决方案：

$("*[rel=tooltipTOP]").tooltip({ 
    placement: "top", 
    trigger: "hover" 
}); 
$('*[rel=tooltipBOTTOM]').tooltip({ 
    placement: "bottom", 
    trigger: "hover" 
});

来源

2012-09-24 19:35:15

我tryed，它仅适用于1个实例对我来说：/我使用jQuery和引导的最新VERS：/ – sbaaaang

嗯......你能不能给我们一个链接？因为这应该工作 - 我的意思是它的工作：[jsfiddle]（http://jsfiddle.net/mr_foto/BH2GM/） –

它是本地主机基于对不起 – sbaaaang

HTML

<ul class="bs-docs-tooltip-examples"> 
        <li><a href="#" rel="tooltip" data-placement="top" data-original-title="Tooltip on top">Tooltip on top</a></li> 
        <li><a href="#" rel="tooltip" data-placement="right" data-original-title="Tooltip on right">Tooltip on right</a></li> 
        <li><a href="#" rel="tooltip" data-placement="bottom" data-original-title="Tooltip on bottom">Tooltip on bottom</a></li> 
        <li><a href="#" rel="tooltip" data-placement="left" data-original-title="Tooltip on left">Tooltip on left</a></li> 
</ul>

个

$('a').tooltip();

DEMO

来源

2012-09-24 19:35:21

不起作用它仅适用于1个实例：/ – sbaaaang

请参阅DEMO，请检查是否包含所有必需的文件 –

可能需要更新bootstrap-tooltip.js文件 –

您的问题也许是，你用你的工具提示上动态生成的元素呢？我有同样的问题用一个“活”得到它的工作...

$(document).live("mouseover", function() { 
    $('.tooltipTop').tooltip({ 
     placement: "top" 
    }); 
    $(".tooltipBottom").tooltip({ 
     placement: "bottom" 
    }); 
    $(".tooltipRight").tooltip({ 
     placement: "right" 
    }); 
    $(".tooltipLeft").tooltip({ 
     placement: "left" 
    }); 
});

来源

2013-04-04 16:19:01 AinStain

我觉得这个问题是jQuery选择。

如果有提示的两个实例，你可以做到这一点

$("body").tooltip({ 
    selector: "*[rel=tooltipTOP]", 
    placement: "top" 
    }); 
    $('html').tooltip({ 
    selector: "*[rel=tooltipBOTTOM]", 
    placement: "bottom" 
    });

注意jQuery选择是不同的。首先是BODY秒是HTML

来源

2014-08-10 14:38:34 Pavlito

真棒，谢谢！为我节省了一些头痛。 – maryisdead

我很高兴听到:) – Pavlito

BOOTSTRAP提示多情况下不能正常工作

回答

相关问题