javascript - jQuery UI可拖动事件不起作用

我正在使用jQuery和jQuery UI来使某些div可拖动，这是可行的。

$(".bluebox").draggable({
  revert: true,
  start: function() {
    $("#bluebox").css("background-color", "#43c8d4");
  },
  drag: function() {
    $("#bluebox").css("background-color", "green");
  }
});

但是，启动和拖动事件不会导致css运行。

这是小提琴：https://jsfiddle.net/Lqop6ho6/

最佳答案

您的jQuery选择器是错误的。

您尝试定位的元素具有名为bluebox的类，而不是ID，因此选择器应为$(".bluebox")而不是$("#bluebox")-(updated example)。



附带说明，由于您正在.bluebox方法中重新选择.draggable()元素，因此可以使用this关键字，因为它将引用该元素：

$(".bluebox").draggable({
  revert: true,
  start: function(){
    $(this).css("background-color", "#43c8d4");
  },
  drag: function(){
    $(this).css("background-color", "green");
  }
});

还值得指出的是，start回调不会产生任何效果，因为它会被drag方法的样式更改覆盖。