时间戳

首页 > 解决方案 > 当我的 TinyMCE 插件在编辑框中插入标签时，输入的文本会出现在该标签内而不是外部。我该如何避免这种情况？

tinymce - 当我的 TinyMCE 插件在编辑框中插入标签时，输入的文本会出现在该标签内而不是外部。我该如何避免这种情况？

问题描述

我在这里使用插件来提及 TinyMCE，所以当我键入 @ 时，它会显示 JSON 结果，我可以从列表中进行选择。

https://github.com/StevenDevooght/tinyMCE-提及

我添加了这段代码，它在<span>html 标记中返回选定的值和名称：

insert: function(item) {
    return '<span class="mention" id="' + item.sequence + '">@' + item.name + '</span>';
},

问题是，它按预期插入了选定的值，但是当我继续在 textarea 中输入时，它仍保留在<span>标记的值内。

选择项目后，我想继续在标签之外输入。

标签： tinymcetinymce-plugins

解决方案

这不完全是一个修复，更多的是一个愚蠢的解决方法：

insert: function(item) {
    return ('<span class="mention" id="' + item.sequence + '">@'
        + item.name + '</span>&zwnj;');
},

这将在元素之后插入一个 U+200C ZERO WIDTH NON-JOINER 代码点<span>，这将强制插入符号出现在元素之外。任何“虚拟”角色都可以；由于我认为是类似的原因，原始库做了类似的事情（与）。&nbsp;事实上，&nbsp;甚至可能会更好，因为至少它对用户是可见的，所以当他们点击 时，他们不会对一个不可见的字符被删除感到惊讶Backspace。

推荐阅读