如何有条件地拖放div

时间:2016-10-10 11:43:18

标签: jquery

将div从 FIRST 移动到第二

我需要检查

第二

中是否已存在此div

(基于tag-id =“2”video-id =“4”属性)

我试过这种方式

在停止回调函数内拖放期间

我正在尝试获取tag-id

但是我发现了以下错误

VM317:95未捕获TypeError:$(...)。attr(...)。最近的不是函数

var PortletDraggable = function () {

    return {
        //main function to initiate the module
        init: function () {

            if (!jQuery().sortable) {
                return;
            }

            $("#sortable_portlets").sortable({
                connectWith: ".portlet",
                items: ".portlet", 
                opacity: 0.8,
                handle : '.portlet-title',
                coneHelperSize: true,
                placeholder: 'portlet-sortable-placeholder',
                forcePlaceholderSize: true,
                tolerance: "pointer",
                helper: "clone",
                tolerance: "pointer",
                forcePlaceholderSize: !0,
                helper: "clone",
                cancel: ".portlet-sortable-empty, .portlet-fullscreen", // cancel dragging if portlet is in fullscreen mode
                revert: 250, // animation in milliseconds
                update: function(b, c) {
                    if (c.item.prev().hasClass("portlet-sortable-empty")) {
                        c.item.prev().before(c.item);
                    }   
                },


                stop: function(event, ui) {

                              console.log($(event.target).attr('id').closest('packlistupdate').attr('tag-id'));

                        }


            });
        }
    };
}();

jQuery(document).ready(function() {
    PortletDraggable.init();
});

https://jsfiddle.net/33keyjxx/22/

你能不能让他们知道如何有条不紊地拖放div?

2 个答案:

答案 0 :(得分:1)

  • 您需要使用find()遍历droppable div。 closest()将遍历以检查从自身开始的父项
  • 一些代码更改:)

    console.log($(event.target).find('.packlistupdate').attr('tag-id'));

Working Demo

答案 1 :(得分:1)

你必须使用'ui'而不是'event',这是Working Demo

以下更改需要停止功能:

  stop: function(event, ui) {
                                    debugger;
                    console.log($(ui.item).attr('tag-id'));
                    console.log($(ui.item).attr('video-id'));
                                }

我希望这个解决方案对您有所帮助。