Question

在一个html页面中，我使用bootstrap模型和bootstrap popover用于不同目的。我使用BS模型进行视频播放和Popover分享这些视频。但我正面临问题与 Popover ，并且Bootstrap模型正常运行。＆安培;在关闭模型popover后无法打开Bootstrap模型调用之前popover工作正常，并且在浏览器控制台中显示错误...这是.. 未捕获的TypeError：$（...）。popover不是函数（...）＆amp; 未捕获的TypeError：无法读取属性＆＃39;提示＆＃39;未定义的（...） 我没有得到相关的解决方案，我试图用 jQuery.noconflict（），var $ = jQuery.noconflict（）＆amp;还有 var bootstrapButton = $ .fn.button.noConflict（）//将$ .fn.button返回到先前指定的值 $ .fn.bootstrapBtn = bootstrapButton ，但同样的问题来了

如果有人面对同样的问题......并得到相同的解决方案...然后帮我解决同样的问题...在此先感谢

错误：

Uncaught TypeError: Cannot read property 'tip' of undefined(…)
Uncaught TypeError: $(...).popover is not a function(…)

jQuery＆amp;我项目中的bootstrap文件。

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>

/*!
* Bootstrap v3.3.5 (http://getbootstrap.com)
* Copyright 2011-2015 Twitter, Inc.
* Licensed under the MIT license
*/
<script type="text/javascript" src="js/libs/bootstrap.js"></script>

Html

<a href="#"><img src="images/new_icons/sharing(22x22).png" height="40" width="40" class="share text-center" title="Share"></a>

jquery popover

$(".share").popover({
                html: true,
                title: 'Share this with... <img width="20" height="20" title="close" data-toggle="clickover"  src="/static/img/new_icons/close(32x32).png" onclick="$(&quot;#share_popover&quot;).popover(&quot;hide&quot;);" id="close_skigit" class="close-skigit">',
                placement: 'auto bottom',
                trigger: 'manual',
                cache:true,
                content: $("#shareContent").html(),
            }).click(function(e){
                $(this).popover('toggle');
                e.preventDefault()   
            });

Answer 1

您需要初始化a元素的弹出窗口，而不是img元素（带有tabindex和role属性）。

此外，默认情况下，弹出框会自动关闭单击。因此，不需要手动触发器或任何点击事件处理程序，据我所知，没有缓存选项对于popover。

您还可以使用data-属性在没有Javascript代码的情况下完成任务。例如，您可以使用：

<a tabindex="0" role="button" data-toggle="popover" title="Share this with..." data-html="true" data-placement="auto bottom" 
  data-content="function() { return $('#shareContent').html(); }">
  <img src="images/new_icons/sharing(22x22).png" height="40" width="40" class="text-center" title="Share">
</a>

Answer 2

问题解决了实际问题是在弹出功能有一个触发器手册和弹出切换的点击事件＆amp;最重要的是popover插件在页面加载时初始化一次所以在同一页面上的bootstrap模型调用之后再次关闭模型后我尝试打开一个popover所以点击popover它的尝试重新初始化再次。并抛出错误消息$（...）。popover不是一个函数。曾经初始化，所以下次由于页面没有刷新，它没有再次初始化。简单的解决方案我发现我删除了手动触发器

$(".share").popover({
                html: true,
                title: 'Share this with... <img width="20" height="20" title="close" data-toggle="clickover"  src="/static/img/new_icons/close(32x32).png" onclick="$(&quot;#share_popover&quot;).popover(&quot;hide&quot;);" id="close_skigit" class="close-skigit">',
                placement: 'auto bottom',
                cache:true,
                content: $("#shareContent").html(),
            })

Answer 3

当我处理bootstrap popover时，我遇到了同样的问题。然后我简单地通过评论＆＃34; jquery.min.js＆＃34;来摆脱这个问题。导入脚本。

popover和＆＃34; jquery.min.js＆＃34;之间必定存在冲突。请通过评论＆＃34; jquery.min.js＆＃34;再试一次。进行。

<!-- <script type="text/javascript" src="./scripts/jquery.min.js"></script> -->

一旦调用模型弹出窗口，第二次弹出窗口不起作用

3 个答案: