在html5上拖动时禁用拖动重影图像

falq053o  于 2023-05-21  发布在  HTML5
关注(0)|答案(3)|浏览(266)

我正在使用原生的html5 API编写拖放代码(即使它还不是那么好)。我研究过了,但我只找到了如何改变鬼影的方法。我不想改变它,但要完全删除它。我该怎么办?非常感谢您的时间。

bnlyeluc

bnlyeluc1#

现在还不可能

替代方式:将其替换为透明图像。

rdlzhqv9

rdlzhqv92#

我的解决方法是设置一个“空”span作为拖动图像。看起来这个元素不可能真的为空,所以需要 

let dragElement = null;

const dragStart = (event) => {
  // remove the element if it exists
  if (dragElement) {
    document.body.removeChild(dragElement);
  }

  // create an empty element
  dragElement = document.createElement("span");
  dragElement.innerHTML = " ";
  dragElement.style.position = "absolute";
  dragElement.style.left = "-1000%";

  // add the element to the dom
  document.body.appendChild(dragElement);

  //set it as the drag image
  event.dataTransfer.setDragImage(dragElement, 0, 0);
};

const dragEnd = (event) => {
  // when we have finished dragging, 
  // remove the element from the dom
  document.body.removeChild(dragElement);
  dragElement = null;
};
mm9b1k5b

mm9b1k5b3#

element.addEventListener('dragstart', (e) => {
   e.dataTransfer?.setDragImage(new Image(), 0, 0);
});

相关问题