jQuery UI可拖動事件不起作用

Question

我正在使用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/

Answer 1

你的jQuery選擇是錯誤的。

您試圖定位的元素有一個名爲bluebox的類，而不是一個ID，因此選擇器應該是$(".bluebox")而不是$("#bluebox") - (updated example)。

---

作爲一個方面說明，既然你重新選擇.draggable()方法中的.bluebox元素，你可以使用this關鍵字，因爲它會引用元素：

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

這也是值得指出那麼start回調將不會產生任何影響，因爲它將被drag方法的樣式更改覆蓋。