Question

最近我一直试图获得被拖动的Div的 id =“whatever-id”属性，但到目前为止我还没有成功。下面你会找到我的代码（只有拖动部分），我试图用ui和事件对象获取这个ID属性，但我看不出它的问题在哪里。

$(function() 
{
    $( ".action-zone" ).draggable(
    { 
        scroll: true,
        helper:"clone",
        snap: ".actionDropAreaMovebleAction",
        snapMode: "inner",
        snapTolerance: 50,
        opacity: 0.7,
        forcePlaceholderSize: true,
        forceHelperSize: true,
        start: function( event, ui ) 
        {
            alert(ui.draggable.attr("id"));

            //INSERT THE DROP ZONE DIV IN ALL ELEMENTS EXCEPT ON THOSE WHOSE CLASS IS DRAGGINGACTION
            $( ".action-zone:not(.draggingAction)" ).after( "<div class='actionDropAreaMovebleAction'>\n\
                                            <div class='plus'>\n\
                                                <i class='fa fa-hand-o-down'></i>\n\
                                            </div>\n\
                                        </div>" );

            $(".actionDropAreaMovebleAction").addClass("highlighted");
            makeActionsDroppable();
        },
        stop:function( event, ui ) 
        {
            $(".actionDropAreaMovebleAction").removeClass("highlighted");
            $("div").remove(".actionDropAreaMovebleAction");
            $(this).removeClass("draggingAction");
            //alert("hallo");
        }
    });
});

正如您所见，我尝试使用“动作区域”类“警告（）”DIV元素的属性ID 仅用于测试目的，但当警报到来时，我会得到一个“ undefined ”元素。

有没有人知道为什么会这样？

我提前感谢你。

Answer 1

只有使用ui.draggable才能将可拖动对象放到其他位置，就像你可以抓住droppable中的对象一样：

$(".drop-zone").droppable({
  drop: function(event, ui) {
    console.log(ui.draggable); // will give you the draggable object
  }
});

但是，在您的draggable start事件中，您可能会得到这样的对象ID：

$(".action-zone").draggable({
  start: function(event, ui) {
    console.log(ui.draggable); // will give you undefined
    console.log(event.target.id); // will give you the id
    console.log(event.target.attr('id')); // error!
    console.log($(event.target).attr('id')); // will give you the id
  }
});

获取使用JQUERY拖动的Div元素的属性ID

1 个答案: