可拖动| Jquery UI。如何在拖动事件上添加类

Question

我正在尝试创建一个滑块，以便用户拖动滑块球，一旦球被拖动，它就会捕捉到包含元素的末尾并触发回调函数（当您解锁屏幕时，请考虑7之前的IOS通过拖动滑块，拖动滑块和屏幕解锁）。我认为最简单的方法是添加一个类，将滑块球的x轴更新到其容器的末尾。

因此，我将元素设置为可拖动的相关包含元素和轴，并沿着容器完美拖动。

sliderBall.draggable({
          containment: $('div.slider-line'),
          axis: "x"
          });

然后我认为它就像绑定＆add.class＆＃39;一样简单。对'拖'＆＃39;这样的事件：

sliderBall.on('drag',function() {
    $(this).addClass('slider-toggle');
});

奇怪的是，选择器被识别为对象而不是DOM元素？

有人可以帮我吗？

Answer 1

您可以使用此代码：

<强> HTML

<div class="sliderBall" data-count="1">drag me!</div>
<div id="divDrop"></div>

<强> JS

$(".sliderBall").draggable();

$("#divDrop").droppable({
  drop: function(event, ui) {    
    ui.draggable.addClass("dropped")
  }
});

<强> Online demo (jsfiddle)

Answer 2

我已经解决了这个问题，但决定在其他人遇到同样问题的情况下提出问题。问题是我添加的CSS类，由于某种原因，该类被添加但它不想更改滑块球的X位置，除非我在类中使用'transformX'而不是'left'。 / p>