javascript - 将元素拖到元素上时，强制元素 :hover 使用 JavaScript。没有 jQuery

Question

我在这里找到了一些搜索结果，但它们都是针对 jQuery 的，而我查看的这对搜索结果并不适用于我的案例。

这是一个小项目，到目前为止我一直避免使用 jQuery。我想保持这种状态，因为不需要图书馆。

基本上，我将一个<article>元素拖到一个元素上<div>。div 有background-image一个封闭的垃圾桶。在 CSS 中，它被设置为在:hover触发时显示相同但打开的垃圾箱。

现在，当我将文章元素拉到 div 时，:hover不会触发效果。我该怎么做呢？

设置了所有必需的元素draggable并添加了所需的事件侦听器，Console.log 确认它们工作。

Answer 1

您可以定义一个名为“open_trash”的 CSS 类，并在那里设置打开垃圾的背景图像，然后您可以使用 javascript 在 mousedown 上更改拖动元素的类，如下所示

document.getElementById("draggedItem").className = "open_trash";

您可以将类名设置为空字符串或其他 onmousedown。