2016-10-28 7 views
0

コメントボックスのようです。人々は自分のコメントを投稿することができます。ここでは、1つのテキストエリアと1つのdivがあります。ボタンを1つクリックすると、コメントが実行されます。コメントはdivに表示されます。私は彼らが望む方法でテキストを編集できる外部のリンク を与えました。テキストエリアから別のdivにコンテンツを公開

<div id="sample"> 
<script type="text/javascript" src="http://js.nicedit.com/nicEdit- latest.js"> </script> 
<script type="text/javascript"> 
    //<![CDATA[ 
    bkLib.onDomLoaded(function() { nicEditors.allTextAreas() }); 
     //]]> 
    </script> 
    <h4>First Textarea</h4> 
    <textarea name="area1" cols="40"></textarea> 
</div> 

<button type="submit" value="submit" 
     style="background-color:red; color:#fff; 
     width:80px; height:50px; padding:5px;" onclick=""> Submit</button> 

<div id="demo" style="width:300px; height:200px; border:1px solid #333;"></div> 
+1

そして、あなたの正確な質問は何ですか? – reporter

+0

一度クリックするとコメントがdivに表示されます – sinoob

答えて

0

まず、あなたのtextarea ID値与える必要があります:あなたは、エディタを作成した後、あなたのスクリプトで、あなたからテキストを抽出することができます関数を作成する必要があり、その後

<textarea id="commentEditor" name="area1" cols="40"></textarea> 

をあなたのNicEditボックスをdivに入れてください。

function SubmitComment { 
    var editor = nicEditors.findEditor("commentEditor"); //find the editor by the ID 
    var commentText = editor.getContent(); //this gets the actual text content from it 

    //then assign the div with your content 
    var commentDiv = document.getElementById('demo'); 
    commentDiv.innerHTML = commentText; 

    //afterwards, you can clear the comment entry box 
    editor.setContent(""); 
} 

あなたはこの機能をトリガするために、あなたのボタンを教えてください

<button type="submit" value="submit" 
    style="background-color:red; color:#fff; 
    width:80px; height:50px; padding:5px;" onclick="SubmitComment"> Submit</button> 
関連する問題