Question

我在CodePen和JSFiddle上都有一个在这里可以正常工作的代码，但是一旦我将其复制并粘贴到Sublime Text并使用Firefox启动网站后，下拉菜单将不起作用。< / p>

我已建立网络连接，并使用一些浏览器进行了检查。我该如何解决这个问题？

Answer 1

问题是加载脚本时jQuery尚未准备就绪。

这些Web开发平台（如CodePen和JSFiddle）通常在加载每个依赖项之后加载脚本。

将<script src="script.js"></script>移到</body>标记之前，它应该可以正常工作。

Answer 2

按照subarachnid用户的建议，将.html文件更改为以下内容：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Herbe Armée, Folle Béton</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>

    <img class="titre" src="titre.png">

    <div class="wrapper-top">
        <div class="one">
            <ul class="menu">
                <li class='sub-menu'>
                    <a href='#'>Expositions passées</a>
                    <ul>
                        <li> <a href='#'>Nom de l'expo 1</a></li>
                        <li> <a href='#'>Nom de l'expo 2</a></li>
                        <li> <a href='#'>Nom de l'expo 3</a></li>
                    </ul>
                </li>
            </ul>
        </div>
        <div class="two">Instagram, Facebook, mail</div>
        <div class="three">Exposition en cours</div>
        <div class="four"></div>
        <div class="five">Artistes</div>
        <div class="six">Six</div>
    </div>
    <div class="wrapper-bottom">
        <div class="seven">Sept</div>
        <div class="eight">Huit</div>
        <div class="nine">Neuf</div>
        <div class="ten">Dix</div>
        <div class="eleven">Onze</div>
        <div class="twelve">Crédits du site</div>
    </div>
    <div class="heure"><span id="cd"></span></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="script.js"></script>

</body>
</html>

https://jsfiddle.net/tdh0z6qy/

Answer 3

或如SaymoinSam所说：我需要将代码放入

$( document ).ready(function() {});

在JSFiddle，CodePen上工作的代码，但不在我的计算机上

3 个答案: