.draggable() 无缘无故不起作用

.draggable() is not working for no reason

我在做我的项目,不得不使用 .draggable()。我无法让它工作,我不知道出了什么问题,所以我决定从 Codeacademy 复制练习,看看它是否能工作。它也没有用。

我的HTML:

<!DOCTYPE html>
<html>
    <head>
        <title>Game Test</title>
        <link rel='stylesheet' type='text/css' href='art.css' />
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script type="text/javascript" src="script.js"></script>

    </head>
    <body>

        <div id="stayaway"></div>

    </body>
</html>

我的CSS:

#stayaway {
    width: 80px;
    height: 80px;
    background-color: blue;
    position:relative;
}

我的 JS:

$(document).ready(function(){
        $("#stayaway").draggable();

});

这只是一个基本功能。我不知道这里出了什么问题。 fadeOut 等其他功能正在运行。

一切都很好。您只需要也包含 jQuery-UI 文件

$(document).ready(function(){
        $("#stayaway").draggable();

});

Working Fiddle

您可以从here

下载

您需要包含 jquery-ui 库:

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<!DOCTYPE html>
<html>
    <head>
        <title>Game Test</title>
        <link rel='stylesheet' type='text/css' href='art.css' />
        <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

        <script type="text/javascript" src="script.js"></script>
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<style>
#stayaway {
    width: 80px;
    height: 80px;
    background-color: blue;
    position:relative;
}
</style>
    </head>
    <body>

        <div id="stayaway"></div>

    </body>

    <script>
    $(document).ready(function(){
        $("#stayaway").draggable();

});
    </script>
</html>