Question

我想访问summer-note编辑器中写入的文本以将其保存到数据库中。

我在我的博客网站上使用夏季便笺，但我无法访问类名为note-editable的div数据。

这是我要访问的div的代码：

<div class="note-editable" contenteditable="true" style="height: 510px;">
    hi...Write an amazing Post....
</div>

任何人都知道如何实现它..提前谢谢......

Answer 1

只需看看开发人员为此任务设置的内容:(来自summernote.org）：

得到＆amp;设置代码

获取匹配集中第一个summernote的HTML内容   元件。

var sHTML = $('.summernote').code();

使用jQuery eq。
获取第二个summernote的HTML内容
var sHTML = $('.summernote').eq(1).code();

要设置为每个匹配元素内容的HTML字符串。

$('.summernote').code(sHTML);

了解更多细节api：深度潜水与api

这段代码有什么问题？你能得到什么？

Answer 2

抓住元素，然后抓取其中的文本。

像这样：

＆＃13;

var content = document.getElementsByClassName('note-editable')[0];

console.log(content.innerHTML)

＆＃13;

<div class="note-editable" contenteditable="true" style="height: 510px;">hi...Write an amazing Post....</div>

＆＃13;

Answer 3

您只需使用 innerText 或 .textContent 属性即可获取div中的文字：

var text = document.getElementsByClassName('note-editable')[0].innerText;

alert(text);

<div class="note-editable" contenteditable="true" style="height: 510px;">Hi...Write an amazing Post....</div>

注意：

避免使用innerHTML，因为它还会返回子代码HTML代码，并引用 innerHTML documentation ：

如果<div>，<span>或<noembed>节点的子文本节点包含字符（＆amp;），（＆lt;）或（＆gt;），则innerHTML将这些字符分别返回为＆amp; amp，＆amp; lt和＆amp; gt。使用Node.textContent获取这些文本节点内容的正确副本。

使用类＆＃39; note-editable＆＃39;访问div的数据。 summer-note editor div

3 个答案: