当代码在本地托管时，Bootstrap Popover无法工作，但在jsbin上工作

这是疯狂的......我一直在试图弄清楚为什么我的popover代码在本地托管时不会工作，但在jsbin上工作正常。让我知道你们的想法，我为此疯狂。感谢大家！当代码在本地托管时，Bootstrap Popover无法工作，但在jsbin上工作

所以在这里，它是：

jsbin：http://jsbin.com/ocepaw/1/edit

  /*///// Libraries jquery & bootstrap libraries ///////*/ 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 

<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 

<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" /> 
<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" /> 

<script src="http://twitter.github.io/bootstrap/assets/js/bootstrap.js"></script>

/*///// relevant HTML: Targets (pop1,2,3) & Triggers (Previous & Next buttons) ///////*/ 

     <a href="#" id="pop1" class="btn" data-content="GREAT CONTENT3" data-original-title="Gamification 1/3"> 
     </a> 

     <a href="#" id="pop2" class="btn" data-content="GREAT CONTENT3" data-original-title="Gamification 3/3"> 
     </a> 


     <a href="#" id="pop3" class="btn" data-content="GREAT CONTENT3" data-original-title="Gamification 3/3"> 
     </a> 


<a href="#" id="NextBtn" class="btn btn-primary"> NEXT </a> 

<a href="#" id="PreviousBtn" class="btn btn-primary"> PREVIOUS </a> 



    /*///// CSS ///////*/ 

     var currentPopover = -1; 
     var popovers = []; 

    // Initialize all the popovers to be "manually" displayed. 
    popovers.push($("#pop1").popover({ trigger: 'manual' })); 
    popovers.push($("#pop2").popover({ trigger: 'manual' })); 
    popovers.push($("#pop3").popover({ trigger: 'manual' })); 


    // On each button click, hide the //currently displayed popover 
    // and show the next one. 



    $("#NextBtn").click(function() { 
    if (currentPopover >= 0) { 
    popovers[currentPopover].popover('hide'); 
    } 

    currentPopover = currentPopover + 1; 
    popovers[currentPopover].popover('show'); 


    }); 


    $("#PreviousBtn").click(function() { 

    popovers[currentPopover].popover('hide'); 


    currentPopover = currentPopover -1; 
    popovers[currentPopover].popover('show'); 


    });

来源

2013-06-20 Max

最后一个脚本是缺少“从URL的末尾，如果你有一个工作jsbin你可能也张贴了。 –

http://jsbin.com/ocepaw/1/edit – Max

你在调试控制台中获得什么错误 – Jasen

我有一个类似的问题在很久以前。下面是我解决它的方法：我改变了我导入的.css和.js文件的顺序。尝试加载第一个引导程序的必需文件，然后加载其他所有文件。希望它也能为你工作！如果没有，那么你的代码有问题。

来源

2013-06-20 02:34:27 mario

好一个，但试了已经...... – Max

如何申报 'HTTP？！ // twitter.github.io/bootstrap/assets/js/bootstrap-popover.js' ju st之前标记 – mario

bootstrap-popover.js不需要，因为已经包含在bootstrap.js中 – equisde

尝试宣告CSS和JS没有冗余，并以正确的顺序：

<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" /> 
<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" /> 

<script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script> 
<script src="http://twitter.github.io/bootstrap/assets/js/bootstrap.js" type="text/javascript"></script>

来源

2013-06-20 11:10:24 equisde

当代码在本地托管时，Bootstrap Popover无法工作，但在jsbin上工作

回答

相关问题