javascript-如何通過鼠標位置分離特定元素？

Question

我有構建設計師的項目，但是如果鼠標移到一個矩形上，則要分離特定元素的問題很小。 我需要知道哪個矩形

html類似於此https://jsfiddle.net/abdulaziz_IS1995/YjC6y/3820/

我的拖放代碼！

• element參數 ：表示html中的selectedElement。
• 最接近的父級 ：表示最接近於所選元素的父級。

  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 輸入圖像描述。

我在我的代碼上添加了這個

  element.addEventListener('mousedown', function (e1) { isDown = true; offset = [ closestDiv.offsetLeft - e1.clientX, closestDiv.offsetTop - e1.clientY ]; ele = document.elementFromPoint(e1.clientX, e1.clientY); if (ele.parentElement.id !== org.id) { alert(ele.parentElement.id); } }, true);