文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在一页中使用多个markDown编辑器？

问如何在一页中使用多个markDown编辑器？
EN

Stack Overflow用户

提问于 2016-04-14 10:43:52

回答 1查看 187关注 0票数 0

我需要从用户那里获取输入，这应该是在每个onKeyup()事件上向用户预览。

从外观和功能上看，它应该与"StackOverFlow“文本输入编辑器相同。

我对此做了很好的研究。分享给其他有需要的人。

感谢和问候，

阿伦·德瓦

markdown

javascript

jsp

editor

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-04-14 10:43:52

查看完整的代码: Multiple_Editor_In_One_Page.jsp

第1步：

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page session="false" %>

<html>
<head>
<title>Emotions</title>
<script src="resources/recmJs/Markdown.Converter.js"></script>
<script src="resources/recmJs/Markdown.Editor.js"></script>
<script src="resources/recmJs/check.js"></script>

<link rel="stylesheet" type="text/css" href="resources/recm/feedBack.css">

<script type="text/javascript">

function showPreviewUsingMarkDownEditor( uid )
{
    var converter = new Markdown.Converter();

    var editor = new Markdown.Editor(converter, uid);

    editor.run();
}

</script>

</head>




<body>

<br>
<div id="MarkdownEditor-1"> 

    <p><b>MarkdownEditor-1 in one this page </b></p>

    <div id="write-title" class="wmd-panel">
        <textarea onkeyup="showPreviewUsingMarkDownEditor('-1')" class="wmd-input" id="wmd-input-1" cols="50" rows="6"></textarea>
        <div id="wmd-preview-1" class="wmd-panel wmd-preview"></div>
    </div>
</div>


<br>
<div id="MarkdownEditor-2"> 

    <p><b>MarkdownEditor-2 in one this page </b></p>

    <div id="write-title" class="wmd-panel">
        <textarea onkeyup="showPreviewUsingMarkDownEditor('-2')" class="wmd-input" id="wmd-input-2" cols="50" rows="6"></textarea>
        <div id="wmd-preview-2" class="wmd-panel wmd-preview"></div>
    </div>
</div>




<br>
<div id="MarkdownEditor-3"> 

    <p><b>MarkdownEditor-3 in one this page </b></p>

    <div id="write-title" class="wmd-panel">
        <textarea onkeyup="showPreviewUsingMarkDownEditor('-3')" class="wmd-input" id="wmd-input-3" cols="50" rows="6"></textarea>
        <div id="wmd-preview-3" class="wmd-panel wmd-preview"></div>
    </div>
</div>


<br>
<div id="MarkdownEditor-4"> 

    <p><b>MarkdownEditor-4 in one this page </b></p>

    <div id="write-title" class="wmd-panel">
        <textarea onkeyup="showPreviewUsingMarkDownEditor('-4')" class="wmd-input" id="wmd-input-4" cols="50" rows="6"></textarea>
        <div id="wmd-preview-4" class="wmd-panel wmd-preview"></div>
    </div>
</div>


<br>
<div id="MarkdownEditor-5"> 

    <p><b>MarkdownEditor-5 in one this page </b></p>

    <div id="write-title" class="wmd-panel">
        <textarea onkeyup="showPreviewUsingMarkDownEditor('-5')" class="wmd-input" id="wmd-input-5" cols="50" rows="6"></textarea>
        <div id="wmd-preview-5" class="wmd-panel wmd-preview"></div>
    </div>
</div>


</body>

</html>

第二步：

关键部分是:使用三个参数的标记编辑器，第一个是强制性的，第二个和第三个是可选的。

在第二次辩论中，通过了区分后缀。

正如您所知，标记编辑器总是在寻找#wmd-input、#wmd-preview元素。

为了在同一页面中区分它，它在上面的ids中添加了后缀，并将该后缀作为第二个参数传递。

仅此而已。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/36620734

复制

相似问题

问如何在一页中使用多个markDown编辑器？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在一页中使用多个markDown编辑器？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在一页中使用多个markDown编辑器？
EN