Summernote 将光标指向插入的 HTML 末尾

Posted

技术标签:

【中文标题】Summernote 将光标指向插入的 HTML 末尾【英文标题】:summernote point cursor at the end of the HTML inserted 【发布时间】:2019-03-31 20:55:55 【问题描述】:

我要做的是在页面上选择文本并将该文本添加为​​文本编辑器中的引号,即summernote。

效果很好,我正在使用以下代码来实现相同的效果

$pby = 'someone';
$selected_txt = $.trim(window.getSelection().toString());
$quote_htm = '<blockquote class="hero"><small><i class="fa fa-quote-left"></i> originally posted by <strong>'+$pby+'</strong></small><em>'+$selected_txt+'</em></blockquote><br /><p></p>';

要将上面的引用插入到summernote文本编辑器中,我正在使用以下代码

$existing_htm = $("#forum_reply_descr").summernote("code");
$html = ($existing_htm == '<p><br></p>' ? '' : $existing_htm)+$quote_htm;
$("#forum_reply_descr").summernote("code", $html);
$("#forum_reply_descr").summernote(focus: true);

这也很好,但是光标位置仍然在文本的开头,我想将光标定位在 html 的末尾,但我找不到任何东西可以以编程方式将光标移动到最后!

有没有一种方法可以使用 Summernote API 或任何 hack 来移动光标以达到相同的结果?谢谢。

【问题讨论】:

【参考方案1】:

尝试在您的项目中实现这一点

$('#some_id').focus(function()
  var input1 = this;
  setTimeout(function() input1.selectionStart = input1.selectionEnd = 10000; , 0);
);


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id='some_id' type='text' value='input message here with cursor at the end'>

【讨论】:

以上是关于Summernote 将光标指向插入的 HTML 末尾的主要内容,如果未能解决你的问题,请参考以下文章

通过 Ajax 将 Summernote 代码发布到 PHP,然后插入数据库

将上传的图片插入summernote编辑器

基于Metronic的Bootstrap开发框架经验总结(17)-- 使用 summernote插件实现HTML文档的编辑和图片插入操作

Summernote 所见即所得

在summernote上传的图片之间插入br标签

如何在 Summernote 中插入占位符元素?