當代碼在本地託管時，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上工作

回答

相關問題