jQuery代碼無法通過xampp在Firefox中運行，而在其他瀏覽器中通過xampp以及Firefox在本地運行時無法運行

Question

我jQuery代碼不與XAMPP 只工作在Firefox，但它確實當我在本地在Firefox中打開HTML文件。 它也不會在邊緣，Chrome和IE XAMPP工作。 這是jQuery代碼：

 $(document).ready(function (){
        // Hightlight the menu button of the current page by comparing its href to the current url.
        var url = window.location.href;
        $('.navMenu a').each(function() {
            if (url == (this.href)){
            $(this).addClass('active');
            }
        });
        // Highlight the login button if pressed and remove the highlights on other menu buttons.
        $('.loginButton').click(function(){
            $(this).toggleClass('active');
            $('.login').slideToggle();
        });
    });

這是我的html代碼：

<!DOCTYPE html>
<html ng-app="store">
    <head>
        <title>The Restaurant | Home</title>
        <link rel="icon" href="../images/favicon.png">
        <meta charset="UTF-8">
        <link rel="stylesheet" href="../css/layout.css">
        <link rel="stylesheet" href="../css/login.css">
        <script src="../scripts/angular.min.js"></script>
        <script src="../scripts/jquery-3.1.0.js"></script>
        <script src="../scripts/main.js"></script>
        <script src="../scripts/UI.js"></script>
    </head>
    <body>
        <header>
            <figure>
                <a href="home.html"><img src="../images/storelogo.png" alt="Logo of the store"></a>
            </figure>
            <nav>
                <navigation-menu></navigation-menu>
            </nav>
        </header>
        <main>
            <login-menu></login-menu>
        </main>
        <footer>
            <ul>
                <li><a href="about.html">About</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </footer>
    </body>
</html>

jQuery代碼在UI.js文件中。 在main.js文件中，此代碼存在：

(function(){

  var app = angular.module('store', []);

  app.directive('navigationMenu', function(){
    return {
      restrict: 'E',
      templateUrl: 'snippets/navigation-menu.html'
    };
  });

})();

最后，這是navigation-menu.html中的代碼：

<ul class="navMenu">
  <li><a href="home.html">...</a></li>
  <li class="dropdown">
    <a href="tops.html">...</a>
    <ul class="subMenu">
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
    </ul>
  </li>
  <li class="dropdown">
    <a href="bottoms.html">...</a>
    <ul class="subMenu">
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
    </ul>
  </li>
  <li class="dropdown">
    <a href="accessories.html">...</a>
    <ul class="subMenu">
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
      <li><a href="#">...</a></li>
    </ul>
  </li>
  <li><a class ="loginButton">Log in</a></li>
</ul>

我已經嘗試過一些方法：例如混合腳本順序並將事件參數添加到click函數，但是這些方法都沒有解決。 我確實看到的一件事是，當我用navigation-menu.html中的代碼替換navigation-menu標記時，一切正常。 因此，以某種方式在angularjs添加navigation-menu.html之前運行jQuery代碼嗎？ UI.js也會運行，因為如果在我放置警報時顯示警報消息，則會顯示該消息。

Answer 1

我已經找到解決問題的辦法。 我不得不將我的jQuery代碼放在指令內的鏈接函數中。 鏈接功能可確保在編譯並鏈接了指令后即可運行它。 如果有人想要代碼中顯示的解決方案，只需在注釋中提出要求即可。

jQuery代碼無法通過xampp在Firefox中運行，而在其他瀏覽器中通過xampp以及Firefox在本地運行時無法運行

問題描述

1 個解決方案

解決方案1
0 已采納 2016-08-29 15:47:03

jQuery代碼無法通過xampp在Firefox中運行，而在其他瀏覽器中通過xampp以及Firefox在本地運行時無法運行

問題描述

1 個解決方案

解決方案1 0 已采納 2016-08-29 15:47:03

解決方案1
0 已采納 2016-08-29 15:47:03