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