javascript - 如何像Medium一样进行拖放？

Question

关闭。这个问题需要多问 focused 。目前不接受答案。

---

想要改进此问题吗？更新问题，使其仅关注一个问题 editing this post .

已关闭 6 年前。

Improve this question

我是 javascript 新手，我对这种拖放操作感到非常困惑。我想喜欢medium.com像这样。

GIF

我正在使用草稿js构建一个内容编辑器，并且我不知道如何在 javascript 中做到这一点。提前致谢...

Answer 1

您需要使用dragEnter作为事件来将css添加到该区域。有很多方法可以做到这一点。

<div ondragenter="dragEnter()" class="div1" id="test" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

然后在js中

function dragEnter(e){
var thing = document.getElementById('test');
thing.classList.add('div2');

}

你的 CSS 看起来像这样

.div1 {
width: 350px;
 height: 70px;
padding: 10px;

  }
.div2 {
 width: 350px;
 height: 70px;
 padding: 10px;
 border: 1px solid #aaaaaa;
 }

这是一个 jsfiddle 示例。 http://jsfiddle.net/camccar/afPrc/197/