jquery-ui-droppable не может различить два вида div, которые можно перетаскивать?

Question

У меня вопрос в Jqueryui Droppable. Извините, мой английский плохой.Ситуация такова: теперь у меня есть 3 div, div a, div b и div c. Я делаю div a и div b перетаскиваемыми, div c - перетаскиваемыми. DIV C может принимать div a и div c.Вопрос в том, что теперь div c может принять div a и div b в качестве Copy, или div c может принять div a и div b в качестве Shear. Я надеюсь, что div c может принять div a в качестве копии и div b в качестве Shear. Как я могуполучить это?

Answer 1

Это (на английском) распространенная проблема;)

Вы можете установить класс для перетаскиваемых объектов, а затем сопоставить контекст с событием drop.

$(function() {
    $( "#diva" ).draggable(
        drag: function(event, $ui) {
            $ui.addClass('copy');
        },
        stop: function(event, $ui) {
            $ui.removeClass('copy');
        }

    );
        $( "#divb" ).draggable(
        drag: function(event, $ui) {
            $ui.addClass('shear');
        },
        stop: function(event, $ui) {
            $ui.removeClass('shear');
        }

    );

    $( "#divc" ).droppable({
        drop: function( event, $ui ) {
            // you can access the dragglable html by this
            // and then can append it to anywhere, its like making its copy
                var html = $ui.draggable.html();
                if ($ui.draggable.hasClass('shear')) {
                    // destroy #divb here so that it looks like shear
                }
        }
    });
});