Question

我正在处理我的项目并且必须使用.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这样的其他功能正在发挥作用。

Answer 1

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

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

});

Working Fiddle

您可以从 here

下载

Answer 2

您需要包含jquery-ui库：

Component c

Answer 3

<!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>

.draggable（）无法正常工作

3 个答案: