Question

你好我现在正在使用tinymce最新版本。我的内容中有一张图片，我禁用了调整大小。

现在，我想知道是否有可能的方法让你不能删除它？

Answer 1

您需要避免可以删除这些图像的操作。如果您无法避免删除图像，则必须确保在之后的正确位置重新插入图像。为此，您需要一个在实际编辑器选择中检查图像的功能和另一个负责插入的图像。

您需要调整以保留图像（操纵插入符号）的操作：

BACKSPACE，ENTF（js键码8和46）：范围被碰撞！

// this is tinymce 3 syntax, tinymce 4 looks only a bit different
ed.onKeyDown.add(function onkeydown(ed, e) {
    var rng = ed.selection.getRng();
    if (e.keyCode == 46 && rng.collapsed) { // BACKSPACE
        // manipulate the caret in the editor and set if after the image, in case there are several adjacent images set the caret after all these image
    }
    else if (e.keyCode == 8 && rng.collapsed) { // ENTF
        // manipulate the caret in the editor and set if before the image, in case there are several adjacent images set the caret before all these image
    }

});

嗯，还有选择内容的情况，因此范围不会折叠（Backspace，Entf，cmd / ctrl + x，cmd / ctrl + v，用字符覆盖选定的内容）。

在这种情况下，如果所选内容中有图像，则需要检查onKeyDown。您需要保存它们并在默认浏览器操作后重新插入这些元素。

var image_string = '';
var node = ed.selection.getNode();
var $node = $(node);

// checks if a node is inside the range
rangeIntersectsNode: function (range, node) {
    var nodeRange;
    if (range.intersectsNode) {
        return range.intersectsNode(node);
    }
    else {
        nodeRange = tinymce.isIE && !window.is_ie9 ? this.editor.selection.getRng(1) : node.ownerDocument.createRange();
        try {
            nodeRange.selectNode(node);
        } catch (e) {
            nodeRange.selectNodeContents(node);
        }
        return range.compareBoundaryPoints(tinymce.isIE && !window.is_ie9 ? 3 : Range.END_TO_START, nodeRange) == -1 &&
            range.compareBoundaryPoints(tinymce.isIE && !window.is_ie9 ? 1 : Range.START_TO_END, nodeRange) == 1;
    }
},

// save image html to string-variable
$(paragraph).find('img').each(function(){
    if (rangeIntersectsNode(rng, this))
    {
        image_string += $(this).clone().wrap('<div>').parent().html();
    }
});

onKeyUp您需要将此字符串插入编辑器

tinymce.execCommand('insertHTML', false, image_string);

对于粘贴（ctrl + v），我们需要一种不同的方法。您需要使用该函数（tinymce config param）paste_preprocess。检查选择内的图像并使用上面的funytionality，然后直接插入字符串与粘贴的内容：

o.content = o.content + image_string;

此外，请注意：如果没有自己的浏览器AddOn，您将无法拦截浏览器菜单上发生的删除。

tinymce，块删除对象？

1 个答案: