bootstrap工具提示适用于一个按钮但不适用于其他按钮

时间:2014-05-27 17:58:25

标签: twitter-bootstrap

我有一个bootstrap工具提示,我定义如下:

<button id="tooltip1" type="button" class="btn btn-default pull-right" 
                        data-toggle="tooltip" 
                        data-placement="right" 
                        data-original-title="Add a Program"
                        ng-click="display.addprogram = true">
                        <span class="glyphicon glyphicon-plus-sign pull-right"></span>
                    </button>

<button id="tooltip1" type="button" class="btn btn-default pull-right"
                                    data-toggle="tooltip" 
                                    data-placement="right" 
                                    data-original-title="Add a Course"
                                    ng-show="{{node.min_credit}} != summedcompleted[{{node.id}}]"
                                    ng-click="open({{node.id}}, {{node.min_credit}}, summedcompleted[{{node.id}}], summedplanned[{{node.id}}])"><span class="glyphicon glyphicon-plus-sign pull-right"></span>
                            </button>

<script id="tooltipid" type="text/javascript">
            $(document).ready(function() {
                $('#tooltip1').tooltip();
            });
        </script>

工具提示仅适用于第一个按钮,但不适用于第二个按钮。可能会发生什么?

1 个答案:

答案 0 :(得分:3)

HTML ID必须是唯一的。您有两个ID tooltip1的元素,这是不合法的。您应该使用类,例如:

$('.btn').tooltip();