Bootstrap   发布时间:2022-04-18  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了twitter bootstrap css / javascript库中的“popover”问题大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图在我的网站上使用twitter bootstrap实现popover javascript,但我不能.如果有人可以帮助我使用我的代码,我会非常感激.提前谢谢你.
<head>
...
    <script src="scripts/jquery.min.js"></script>
    <script src="scripts/html5.js"></script>  
    <script src="scripts/bootstrap-tabs.js"></script>
    <script src="scripts/bootstrap-alerts.js"></script>
    <script src="scripts/bootstrap-popover.js"></script>
    <script src="scripts/bootstrap-twipsy.js"></script>
    <script src="scripts/bootstrap-modal.js"></script>
    <script src="1.3.0/bootstrap-scrollspy.js"></script> -->

    <link rel="stylesheet" href="bootstrap.css" />

...
</head>
<body>
...

                                <div class="tab-content">
                                    <div class="active" id="dwcenter_iso">
                                        <table class="zebra-Striped">
                                            <thead>
                                                <tr>
                                                    <th>Arquivo</th>
                                                    <th>Tamanho</th>
                                                    <th>Data</th>
                                                    <th>md5</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td><a href="download.PHP">nimbus-opensource-BACkup-1.1.iso</a> <span class="label success">new</span></td>
                                                    <td>332M</td>
                                                    <td>16/09/11</td>

<!-- HERE GOES -->
                                                 <td><a href="#" class="btn danger" rel="popover" title="md5 check Sum" data-content="343453453453453rfef34">ver</a>
                                                       <script>
                                                                $(function () {
                                                          $('a[rel=popover]')
                                                            .popover({
                                                              html: true
                                                            })
                                                            .click(function(E) {
                                                              e.preventDefault()
                                                            })
                                                        })
                                                      </script> 
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>nimbus-opensource-BACkup-1.0.iso <span class="label important">deprecated</span></td>
                                                    <td>332M</td>
                                                    <td>10/08/11</td>
                                                    <td>ver</td>
                                                </tr>
                                                <tr>
                                                    <td>nimbus-opensource-BACkup-0.9beta.iso <span class="label important">deprecated</span></td>
                                                    <td>380MB</td>
                                                    <td>25/09/10</td>
                                                    <td>ver</td>
                                                </tr>

                                            </tbody>
                                        </table>
                                    </div>


...
</body>

我试过“html:true”和bootstrap doc示例“offset:10”.
它确实显示了红色危险按钮,但没有任何反应(弹出窗口不起作用).

还有别的,我怎么能在表格的TD元素而不是按钮上实现呢?

解决方法

更改这两个脚本,因为popover是twipsy的扩展,需要先加载…
<script src="scripts/bootstrap-twipsy.js"></script>
<script src="scripts/bootstrap-popover.js"></script>

您不需要将html设置为true,如果您愿意,可以使用您可以更改的选项

$(function(){$(".btn")
                  .popover({
                      offset: 5,placement: 'left'
                  });
               });

大佬总结

以上是大佬教程为你收集整理的twitter bootstrap css / javascript库中的“popover”问题全部内容,希望文章能够帮你解决twitter bootstrap css / javascript库中的“popover”问题所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。