1ページに複数のmarkDown Editorを使用するには？

すべてのonKeyup（）イベントでユーザにのプレビュー済みを入力する必要があります。1ページに複数のmarkDown Editorを使用するには？

ルックでは、&のように感じると、それは "StackOverFlow"テキスト入力エディタのように同じでなければなりません。

私はそれについてよく研究しました。他の人のためにそれを分かち合いましょう。

おかげ&よろしく、

アルンDhwaj

出典

2016-04-14 ArunDhwaj IIITH

完全なコードを見て：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>

ステップ-2：

核心一部は：3つの議論を取ってマークダウンエディタents、最初は必須、2番目と3番目はオプションです。

2番目のargumnetでは、差別化接尾辞IDが渡されました。

あなたが知っているように、マークダウンエディタは常に#wmd-input、#wmd-preview要素を探しています。

同じページでそれを区別するために、上記のIDに接尾辞を追加し、その接尾辞を2番目のパラメータとして渡します。

すべてです。

出典

2016-04-14 10:43:52

頂点エディタは3つのパラメータをとり、最初は必須、2番目と3番目はオプションです。 –

1ページに複数のmarkDown Editorを使用するには？

答えて

関連する問題