javascript - Firefox：访问将文件从桌面拖放到 HTML 内容可编辑元素后生成的标签

Question

使用 Firefox，当我将图像文件从桌面拖放到 HTMLcontenteditable="true"元素中时，<img>会创建 a。

如何获得<img>在将文件从桌面拖放到 contenteditable 元素后创建的内容，例如，为alt属性设置值或更改其大小？

我的尝试：我认为也许有一种方法可以检索插入到 contentediable 元素中的最后一个（按顺序排列的）元素。

$("#editor").on("dragover", function (event) {
  event.preventDefault();
  event.stopPropagation();
  $(this).addClass('dragging');
});

$("#editor").on("dragleave", function (event) {
  event.preventDefault();
  event.stopPropagation();
  $(this).removeClass('dragging');
});

$("#editor").on("drop", function (event) {
  //how to access here the <img> created after dropping 
  //the file from the desktop
}

p {
  height: 700px;
  width: 700px;
  border: 1px solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id="editor" contenteditable="true"></p>

标签： javascriptjquerydrag-and-drop