Question

我正在寻找一个较小的Javascript＆＃34;编辑＆＃34;在我的网站项目上使用。我发现https://github.com/summernote/summernote/它看起来不错，似乎有一些承诺。

我尝试通过创建以下代码来使用它：

<!DOCTYPE>
<html lang="en">

<head>
    <!-- include libraries(jQuery, bootstrap) -->
    <script type="text/javascript"     src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" />
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <!-- include summernote css/js-->
    <link href="assets/plugins/summernote-master/summernote.css" rel="stylesheet">
    <script src="assets/plugins/summernote-master/summernote.js"></script>
</head>
<body>
<div id="summernote">Hello Summernote</div>
<button onclick="getCode();return false;">Get the code!</button>
<script>
    function getCode()
    {
        var html = $("#summernote").summernote("code");
        console.log(html);
    }

    $(document).ready(function() {
        $("#summernote").summernote();
    });
</script>
</body>
</html>

根据文档，您需要使用.summernote("code")来收集文本编辑器窗口的内容。但是我的Console.log结果：

Object { length: 1, context: HTMLDocument → info.php, selector: "#summernote", 1 more… }  info.php:21:9

有没有人有这个编辑器的经验，可以帮助我理解我需要做的不同的事情？我的目标是以我可以POST到我的应用程序的方式收集用户创建的窗口内容。

感谢您的想法！

Answer 1

将您的HTML更改为以下内容。

<div class="summernote" id="summernote">Hello Summernote</div>

获取代码！

和脚本

<script>   

$(document).ready(function() {
    $(".summernote").summernote();
});

function getCode()
{
    var html = $("#summernote").summernote("code");
    console.log(html);
}
</script>

如何检索Summernote的内容？

1 个答案: