首页 > 解决方案 > 从编辑器中删除上传的图像时删除

问题描述

我创建了一个编辑器,将图像添加到帖子中,直接上传到我的服务器,最后插入到文本编辑器正文中,例如:

<img src="http://mydev.io:8000/storage/c6bc9b4b0ae0244058a4181f8e84007d-1.jpg">

问题是当用户从编辑器中删除此图像时,我如何从服务器中删除它

标签: javascriptlaravelserver

解决方案


正如其他人所说,您需要显示更多代码,以便人们可以看到您的内容编辑器的来龙去脉,但是这样的事情对于您可以做些什么来检测更改事件并开始确定图像是否是非常粗略的有没有。

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"  /">

推荐阅读