设置Jquery可拖动文本的顶部和鼠标移动的左侧？

Question

一个自定义网格，其项目是可拖动的，即，您可以拖动任何行并将其拖放到左侧的树形结构中。

 $("#ulMyItemsNew").append(liItem).find("li").draggable({

                    helper: 'clone',
                    revert: function (event) {
                        //hides tooltip when not a valid drop
                        $(".tooltipProduct:visible").hide();
                        return !event;
                    },
                    cursor: 'move',
                    start: function (event, ui) {     

                        $(this).draggable("option", "cursorAt", {
                            left: event.pageX,
                            top: event.pageY 
                       });


                    },

                    zIndex: 507000
                });

实际上是当我开始从制造商拖动任何行时，我的鼠标和拖动的文本一起移动。但是当我从型号中开始拖动时，我的鼠标和拖动的文本会保持距离。当我从描述开始拖动时，我的鼠标我想要的是，无论是从制造商，型号还是从描述中拖动，拖动文本都应始终与鼠标一起移动。它们之间应该没有距离。

我知道在代码区

 start: function (event, ui) {     

                        $(this).draggable("option", "cursorAt", {
                            left: event.pageX,
                            top: event.pageY 
                       });
                     }

我正在做event.pageX和event.pageY ，该事件不是鼠标移动事件，而是draggable文本事件。我确实在“启动”助手中也调用了一个函数，就像这样

    start: function (event, ui) {     

                           GetMousePosition();
    }

function GetMousePosition() {
 $("#ulMyItemsNew li.ui-draggable-dragging").mousemove(function (event) {

            var offset = $("#ulMyItemsNew li.ui-draggable-dragging").offset();


            $("#ulMyItemsNew li.ui-draggable-dragging").css({ left: event.pageX - offset.left, top: event.pageX - offset.top });


        });
}

但是没有任何工作，因为我想要ulMyItemsNew是ul id，在该id下网格的所有li行都存在。 li.ui-draggable-dragging是draggable文本的类，该类被动态附加在ul的底部。

任何帮助将非常感激 。 我从两个星期开始就陷入困境。 提前致谢 ！！

这是快照-

Answer 1

我认为您开始拖动时已经固定了光标位置：

$(this).draggable("option", "cursorAt", {
                  left: event.pageX,
                  top: event.pageY 
               });

这就是为什么它正在发生。

使用此-

cursorAt: { left: 1, top:1 }

选项以指定相对于可拖动对象的另一个位置（从顶部，右侧，底部和/或左侧指定像素值）。 通过为cursor选项提供有效的CSS光标值（默认值，移动，指针，十字线等）来自定义光标的外观。

在这里查看更多详细信息

可拖动-光标样式

Answer 2

我做到了，它按我的意愿工作。现在，我的光标和可拖动的“ li”一起移动。我不知道cursorAt帮助程序实际上将光标相对于可拖动项设置为上下。

$("#ulDragNew").append(liItem).find("li").draggable({
                    helper: 'clone',

                    cursorAt: {
                        left: 40,
                        top: 20
                    },

                    revert: function (event) {
                        //hides tooltip when not a valid drop
                        $(".tooltipProduct:visible").hide();
                        return !event;
                    },
                    cursor: 'move',



                    zIndex: 100
                });
            }