使用可拖动控件获取左侧和顶部位置

Question

我的页面上有一些可拖动的组件。他们有课 可拖动的。当它被拖动并停止时，我需要获取左侧和顶部位置

        function init() {
            var p = $('#groups-parent');
            $('.draggable').draggable({
                obstacle: ".obstacle",
                preventCollision: true,
                containment: [
                    p.offset().left, p.offset().top, p.offset().left + p.width() - 225, p.offset().top + p.height() - 50
                ], 
                start: function(event, ui) {
                    $(this).removeClass('obstacle');
                },
                stop: function (event, ui) {
                    console.log(ui);
                    $('#groups-parent').css({ 'min-height': Math.max(500, ui.position.top + 50) });
                    $(this).addClass('obstacle');
                    
                    getTopLeftPosition();
                }
            });  
        }

这是我的函数，应该获取左侧和顶部的位置。

        function getTopLeftPosition(e) {
            var coordX = e.pageX - $(this).offset().left,
                coordY = e.pageY - $(this).offset().top;

            alert(coordX + ' , ' + coordY);
        }

这不起作用。我在浏览器中得到的只是这个错误消息

无法读取未定义的属性（读取“左”）

我怎样才能得到这个左侧和顶部的位置？警报应该会指出这一点。

Answer 1

您可能只需要通过更改将this 绑定到函数

getTopLeftPosition();

到任一

getTopLeftPosition.call(this, event);

或

getTopLeftPosition.bind(this)(event)