在html select选项上的Bootstrap 2工具提示 [英] Bootstrap 2 tooltips on html select's option

问题描述

我正在尝试在选项的每个选项的右侧显示toolttip，但不能。

I'm trying to make toolttip display on right of each option of a select, but can't.

 // tooltip select demo
$('#selectdemo option').tooltip();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet"/>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script>

<select id="selectdemo">
    <option data-placement="right" data-toggle="tooltip" data-original-title="Tooltip on left 1" title="Tooltip on left 1">Tooltip on left 1</option>
    <option data-placement="right" data-toggle="tooltip" data-original-title="Tooltip on left 2" title="Tooltip on left 2">Tooltip on left 2</option>
</select>

我是否需要对选项进行特定测试更改事件？

do I need to do a specific test on select option change event ?

推荐答案

显然它不起作用，请注意这个答案： https://stackoverflow.com/a/3275809/1102585

Apparently it won't work, notice this answer: https://stackoverflow.com/a/3275809/1102585

Jquery的输入事件永远不会触发选项，这意味着您无法使用javascript触发< option> 元素，但是，您可以处理输入上的事件< select> 并自行处理工具提示的定位，这是公认的解决方案所做的事情

Jquery's Enter event never fires on an option, meaning you can't use javascript to trigger tooltips on <option> elements you can, however, handle the enter event on <select> and handle positioning of the tooltip by yourself, which is what the accepted solution does

或者，你也可以简单地删除 $（'#selectdemo选项'）。tooltip（）; 调用，因为 title 属性已添加nat选项上的工具提示

Alternatively, you can also simply remove the $('#selectdemo option').tooltip(); call since the title attribute already adds a native tooltip on options

这篇关于在html select选项上的Bootstrap 2工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！