控制台中的可拖动(） 错误

draggable() error in console

本文关键字：错误 拖动 控制台      更新时间：2023-09-26

突然，我在控制台中看到以下错误。我正在加载

<link rel="stylesheet" href="jquery-ui.min.css"> //head
<script src="jquery-2.1.4.min.js"></script> //end of body
<script src="jquery-ui.min.js"></script> //end of body
<script src="belowScript.js"></script> //end of body

Uncaught TypeError: $(...).draggable is not a function

下面的脚本.js：

$( document ).ready(function() {
    function myFunc(e){
       ///some code
       $('#main').draggable({
          containment: $('#net')
       })
       ///some code
    }
});

出了什么问题，我该如何解决这个问题？

不确定这是否是你想要的。我做了一些猜测：https://jsfiddle.net/Twisty/ukh1r21t/

.HTML 

<h2>Drag Test</h2>
<button id="make">Make (Upload) Image</button>
<div id="net">
</div>

.CSS

#net {
  border: 1px solid #222;
  height: 200px;
  width: 300px;
  background: #ccc;
  margin: 10px;
}
.canDrag {
  margin: 3px;
  background: #fff;
  border: 1px solid #999;
  width: 40px;
  height: 60px;
}

JQuery UI

$(function() {
  $("#make").click(function() {
    var i = $(".canDrag").length;
    var newImg = $("<img>", {
      src: "#",
      id: "main-" + i,
      class: "canDrag"
    });
    newImg.draggable({
      containment: $('#net')
    });
    $("#net").append(newImg);
  });
});

将创建新的 Image 对象，然后将其初始化为可拖动对象。您可以使用类来格式化它们，它们各自获得自己唯一的 ID。然后，您可以根据需要设置src值。

相关文章：