javascript - 从编辑器中删除上传的图像时删除
问题描述
我创建了一个编辑器,将图像添加到帖子中,直接上传到我的服务器,最后插入到文本编辑器正文中,例如:
<img src="http://mydev.io:8000/storage/c6bc9b4b0ae0244058a4181f8e84007d-1.jpg">
问题是当用户从编辑器中删除此图像时,我如何从服务器中删除它
解决方案
正如其他人所说,您需要显示更多代码,以便人们可以看到您的内容编辑器的来龙去脉,但是这样的事情对于您可以做些什么来检测更改事件并开始确定图像是否是非常粗略的有没有。
var currentImages = [];
$('body').on('focus', '[contenteditable]', function() {
const $this = $(this);
$this.data('before', $this.text());
return $this;
}).on('blur keyup paste input', '[contenteditable]', function() {
const $this = $(this);
if ($this.data('before') !== $this.text()) {
$this.data('before', $this.text());
$this.trigger('change');
}
});
$('[contenteditable]').on('change', function(){
//looks like I changed.
parseContentEditorAndFindImages( $(this) );
});
function parseContentEditorAndFindImages( $elem ){
var rawHtml = $elem.text();
currentImages = [];
html = $.parseHTML( rawHtml );
$.each( html, function( i, el ) {
//parse html here and detect images
});
}
<div id="myEditor" contenteditable="true" /">
推荐阅读
- java - java arraylist
seems to overwrite existing items when using the add() method - javascript - 在不捆绑的情况下将 url() 解析为图像
- java - 所有最长的字符串
- mysql - MySQL插件标准未加载
- c# - 只需要通过 INTRANET 访问 Azure Web 服务
- vba - UDF is not recognised in excel 2010
- webpack - WEBPACK 错误:当我执行 npm start 时,我收到“参数数量无效”错误
- javascript - (ESLint) Definition for rule 'react/jsx-sort-prop-types' was not found
- android - 如何映射firestore数据库中的特定字段
- ruby-on-rails - ActiveAdmin 去除花括号内的内容