如何检查被拖动的元素是否具有某个class？

Question

如何检查被拖动的某个元素是否具有某个class？

JS代码：

if ($('.fc-event').is('.ui-draggable')) //To check if element is being dragged
{
    console.log('This element is being dragged');
    if ($('.fc-event').is('.ui-draggable').hasClass('music')) //Can't use this.hasClass?
    {
        //place in music database table
    }
    else
    {
        //place in other database table
    }
}

HTML代码：

<div id='external-events'>
    <h4>Music</h4>
    <div class='fc-event music'>Music 1</div>
    <div class='fc-event music'>Music 2</div>
    <div class='fc-event music'>Music 3</div>
</div>

上面的JS代码显然是行不通的，但却是最接近解决方案的。（我认为）

Answer 1

draggable() api 中有一些事件，其中一个是 drag，当您拖动它时会触发，此回调有两个参数 event, ui，其中 ui 将为您提供所需的元素。

$( ".selector" ).draggable({
  drag: function( event, ui ) {
    $('pre').html('$(ui.helper).hasClass("music"):'+$(ui.helper).hasClass('music'));
  }
});

.selector{width:150px; height:100px; border:solid 1px red; background:yellow;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<div class='selector music'>selector</div>

<pre></pre>

如何检查被拖动的元素是否具有某个class？

How to check if element being dragged has a certain class?

javascript

jquery

draggable