Question

自从我触及任何jQuery以来，已经有一段时间了，而且在我的“素数”中我是一个可笑的白痴。我希望在单击某个图标时弹出页脚导航。我在外部文件中尝试了js，现在在我的html文件中只是为了确保我的代码是错误的。我像这样包含jQuery：

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
    <!-- <script src="js/main.js"></script>-->

</head>
<body>

有问题的html的第一部分，ID为“add”的图片将被点击以切换：

<section id="side">
        <nav class="sidebar"><img class="logo" src="images/logo.png"></img>
            <ul>
                <li> <a href="#"> About </a></li>
                <li> <a href="docs.html"> Providers </a></li>
                <li> <a href="#"> Quality </a> </li>
                <li> <a href="#"> Contact </a> </li>
            </ul>
            <img id="add" src="images/phoner.png"></img>
        </nav>
    </side>

这里是我想点击上述图片和jQuery时弹出的内容：

<footer id="footer">
                          <ul>
                             <li> <h2> Joint Replacements </h2></li>
                             <li> <h2>Sports Medicine </h2></li>
                             <li> <h2>Orthopedic Trauma & Fractures </h2></li>
                          </ul>
                     </footer>

        </section>
        <script>
        $( "#add" ).click(function() {
            $( "#footer" ).toggle( "slow" );
        });
        </script>

感谢任何输入的所有内容。

在我的控制台中编辑 -

[Error] Failed to load resource: The requested URL was not found on this server. (jquery.min.js, line 0)
[Error] ReferenceError: Can't find variable: $
    global code (mmp.html, line 74)
[Error] Failed to load resource: The requested URL was not found on this server. (jquery-1.10.2.min.js, line 0)

Answer 1

在fiddle：

中正常工作

<nav class="sidebar">
      <img class="logo" src="images/logo.png"/>
      <ul>
          <li> <a href="#"> About </a></li>
          <li> <a href="docs.html"> Providers </a></li>
          <li> <a href="#"> Quality </a> </li>
          <li> <a href="#"> Contact </a> </li>
      </ul>
    <img id="add" src="images/phoner.png" />
</nav>


<footer id="footer">
    <ul>
        <li> <h2> Joint Replacements </h2></li>
        <li> <h2>Sports Medicine </h2></li>
        <li> <h2>Orthopedic Trauma & Fractures </h2></li>
    </ul>
</footer>

JS：

 $( "#add" ).click(function() {
     $( "#footer" ).toggle( "slow" );
 });

检查jQuery是否已加载
检查是否存在任何控制台错误
检查脚本是否正在执行

jQuery切换混乱

1 个答案: