Jquery和Bootstrap在Firefox中不工作

我有一個用於在幻燈片之間導航的引導按鈕。該按鈕在Chrome中完美運行，但不在Firefox中運行。在第一張幻燈片中，它工作正常，但只要我移動到第二張幻燈片並單擊按鈕以轉到第三張幻燈片，該按鈕消失在頁面中。我已經檢查過，jquery-ui在boostrap js之前加載。Jquery和Bootstrap在Firefox中不工作

生成的HTML：

<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/jquery-ui.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/jquery.fullPage.min.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/affix.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/alert.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/button.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/carousel.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/collapse.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/dropdown.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/tab.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/transition.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/scrollspy.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/modal.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/tooltip.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap/popover.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/bootstrap.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script> 
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>

在Firebug中，我發現了以下錯誤：

Error: TypeError: document.getElementById(...) is null 
Source File: chrome://web-developer/content/overlay/javascript/overlay.js 
Line: 7333

這裏是我的代碼：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $.fn.fullpage({ 
      fixedElements: '.btn-success', 
      'verticalCentered': false 
     }); 

     $('.btn-success').click(function(){ 
      $.fn.fullpage.moveSectionDown(); 
     }); 
    }); 
</script> 

<div class='btn btn-lg btn-success'>Down</div> 
<div class="section " id="section0"><h1>1 Slide</h1></div> 
<div class="section" id="section2"><h1>2 slide</h1></div> 
<div class="section" id="section3"><h1>3 slide</h1></div>

這是一個Firefox的錯誤或者是我的代碼錯了？

來源

2014-02-07 Leo Costa

怎麼樣一個jsfiddle，看看會發生什麼atm？ – Dwza

這看起來像來自Firefox插件的錯誤。你應該在乾淨的Firefox配置文件上試試你的頁面，看看它是否發生在那裏。 – Pointy

@Pointy我該如何做到這一點？ –

這是Firefox中的Web開發人員工具欄插件的已知問題。

附加組件（chrispederick.com）的作者根據他網站上的論壇帖子（編輯：論壇沒有更多）意識到這個問題，但到目前爲止還沒有發佈修正。

來源

2014-03-16 09:17:59

很高興知道這是該插件的問題，我正在慢慢地變得瘋狂。可惜，雖然我還沒有在其他網站上看到它，但它仍然沒有固定和奇怪，只是我最近完成的一個網站。 – Pieter

錯誤仍然存在 - 第7333行，第5列。頁面顯然繼續執行。 – LSerni

FWIW，此答案中的參考鏈接不再存在。 Web開發人員工具欄問題仍然存在。 –

Jquery和Bootstrap在Firefox中不工作

回答

相關問題