在span标记之外的span文本之后添加文本

Question

查看此截图：

我正在使用这段代码添加表情符号在div的跨度。

$('body').on('click', '.selectable-icons', function(e) {
    if (e.target.tagName.toLowerCase() === 'span') {
        document.querySelector('[contenteditable]').appendChild(e.target.cloneNode(true));
        $('[contenteditable]').append(" ");
        var current_text = $('[contenteditable]').html();
        alert(current_text);
        $('.publisher_div').html(current_text);
    }

但span标记后没有附加空格，这样我就可以在span标记后编写下一个文本。

Answer 1

尝试：

$('[contenteditable]').append(" ");

Answer 2

试试这个

  $('.publisher_div').append("hi");

Answer 3

$('[contenteditable]').append（“”）；将为具有contenteditable属性的元素追加一个空格（在您的示例中为span)。如果要在后面添加空格，请使用http://api.jquery.com/after/：

$('[contenteditable]').after(" ");

现场示例：

null

var container = $("#container");
console.log("Before:");
container.contents().each(function(index) {
    console.log(index, this.nodeType, this.nodeType === 3 ? '"' + this.nodeValue + '"' : this.tagName);
});
$('[contenteditable]').after(" ");
console.log("After:");
container.contents().each(function(index) {
    console.log(index, this.nodeType, this.nodeType === 3 ? '"' + this.nodeValue + '"' : this.tagName);
});

<div id="container"><span contenteditable>This is the span</span></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>