Question

任何人都可以帮我解决下面的代码。 Draggable选项不起作用。我无法弄清楚出了什么问题..

<title></title>
<script src="Scripts/jquery-ui.js" type="text/javascript"></script>
<link href="Scripts/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery-1.11.2.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#draggableDiv").draggable();
    });
</script>
<style type="text/css">
 .divClass 
 {
     width:200px;
     height:200px;
     background-color:Blue;
     color: White;
     vertical-align: middle;
     text-align: center;
     display: table-cell;
 }
 #draggableDiv { width: 150px; height: 150px; padding: 0.5em; }
</style>
</head>

拖我走走

Answer 1

你应该订购像这样的jquery脚本。

<link href="Scripts/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery-1.11.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui.js" type="text/javascript"></script>

您可以在jsfiddle

找到此链接

<div id="draggable" class="divClass">
<p>Drag you div</p>
</div>

Answer 2

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

.divClass {
  width: 200px;
  height: 200px;
  background-color: Blue;
  color: White;
  vertical-align: middle;
  text-align: center;
  display: table-cell;
}
#draggableDiv {
  width: 150px;
  height: 150px;
  padding: 0.5em;
}

<script src="//code.jquery.com/jquery-1.10.2.js"></script> <!-- include script -->
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <!-- include script -->
<div id="draggableDiv" class="divClass">
  <p>Drag me around</p>
</div>

也许你只是错过了一些script。确保包含所有脚本

Answer 3

您的代码正在运行，可能是您提供的脚本问题检查一下

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

.divClass 
 {
     width:200px;
     height:200px;
     background-color:Blue;
     color: White;
     vertical-align: middle;
     text-align: center;
     display: table-cell;
 }
 #draggableDiv { width: 150px; height: 150px; padding: 0.5em; }

<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
      <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
      <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

	
<body> 
  
  <div id="draggableDiv" class="divClass"> <p> Drag me around </p> </div> 
</body>

JQuery Draggable选项

3 个答案: