javascript - 如何检查被拖动的元素是否具有特定的类？

Question

如何检查正在拖动的某个元素是否具有某个类？

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>