Question

我有一个构建设计师的项目，但是如果鼠标移到一个矩形上，我就很难拆下特定的元素。我需要知道哪个矩形

html类似于此https://jsfiddle.net/abdulaziz_IS1995/YjC6y/3820/

我的拖放代码！

element参数：表示html中的selectedElement。
closestDiv ：表示与所选元素最接近的父级。

   function trackArea(element, closestDiv) {
   var x = closestDiv.position().top;
        var y = closestDiv.position().left;
        if (element.getBoundingClientRect().top >= x && element.getBoundingClientRect().left >= y) {
            $(closestDiv).droppable({ tolerance:closestDiv});
            $(element).draggable({
                containment: closestDiv[0],
                cancel: '',
                appendTo: closestDiv[1],
                accept:element, 
                option: ''
            }, true); 
            $(element).sortable({
                change: function (event, ui) {
                    var currentClass = $(ui.placeholder)[0].classList[0];
                    if (!$(ui.placeholder).prev().hasClass(currentClass) && !$(ui.placeholder).next().hasClass(currentClass))
                        return false;
                    }
            });
            $(element).disableSelection();
            element.addEventListener('mousedown', function (e1) {
                isDown = true;
                offset = [
                    closestDiv.offsetLeft - e1.clientX,
                    closestDiv.offsetTop - e1.clientY
                ];
            }, true);
            element.addEventListener('mouseup', function () {
                isDown = false;
            }, true);
            element.addEventListener('onmousemove', function (event) {
                event.preventDefault();
                if (isDown) {
                    mousePosition = {
                        x: event.clientX,
                        y: event.clientY
                    };
                    element.style.left = (mousePosition.x + closestDiv.offset[0]) + 'px';
                    element.style.top = (mousePosition.y + closestDiv.offset[1]) + 'px';
                }
            }, true);
            if ($(element).parent('DIV')[0].id === closestDiv[0].id) {
                closestDiv[0].addEventListener('mousedown', function () { this.setAttribute("draggable", false);});
                closestDiv[0].addEventListener('mouseup', function () { this.setAttribute("draggable", false); });
            }
        } else if (element.getBoundingClientRect().top <=x   && element.getBoundingClientRect().left >= y ) {
            element.addEventListener('mousemove', function () {
                mousePosition = {
                    x: event.clientX,
                    y: event.clientY
                };
                element.style.left = (mousePosition.x + offset[0]) + 'px';
                element.style.top = (mousePosition.y + offset[1]) + 'px';
            } , false ); 
        }

Answer 1

通过CSS即可实现

yourHTMLElement {pointer-events: none;}

Answer 2

我使用了一个名为“ elementFromPoint”的函数，我把鼠标的坐标放到了主div enter image description here

我在我的代码中添加了

class TestClass:

    def __init__(self):
        self.one = 1
        self.two = 2


test_obj = TestClass()


def test_func(arg):
    arg.one = 10

test_func(test_obj)
print(test_obj.one)

javascript-如何通过鼠标位置分离特定元素？

2 个答案: