2012-09-03 59 views
-1

我遇到過http://redactorjs.com這是一個非常好的wysiwig編輯器,具有空中能力。換句話說,在一行中,您可以將靜態div轉換爲可編輯的文本區域。Jquery基於WYSIWYG的直播可能性

我不願意爲此付款(出於某些原因,我不會透露),因此我正在尋找替代品。

你有沒有使用過輕鬆實用的輕量級wysiwig jquery編輯器?

我要找的東西,我會爲後續使用:

$("#edit_btn").click(function({ 
    $("#my_div").turnIntoEditor(); 
})); 

$("#save_btn").click(function({ 
    $("#my_div").post_content("http://target"); 
    $("#my_div").turnIntoStatic(); 
})); 

請不要介意POST_CONTENT啄和其他函數名,因爲它們只是給出了參考,以顯示我照看的一種用法。

謝謝

+0

你應該籤另一篇文章http://stackoverflow.com/questions/708801/whats-the-best-edit-in-place-plugin-for- jQuery的 – Binz

回答

0

我終於去了ckeditor。我可以很容易地使用它如下(POC):

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
      <html xmlns="http://www.w3.org/1999/xhtml"> 

       <head> 
        <meta content="text/html; charset=UTF-8" http-equiv="content-type"/> 
        <title>Title</title> 


        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
        <script type="text/javascript" src="ckeditor/ckeditor.js"></script> 
        <script type="text/javascript" src="ckeditor/adapters/jquery.js"></script> 
        <script type="text/javascript"> 
         $(document).ready(function(){ 
          $("#edit").click(function(){ 
           $('.editable').ckeditor(); 
          }); 

          $("#save").click(function(){ 
           var editor = CKEDITOR.instances['editor']; 
           if (editor) { editor.destroy(); } 

           alert($('#editor').html()); 
          }); 
         }); 

        </script> 
       </head> 
      <body> 
       <span id="edit">EDIT</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span id="save">SAVE</span><br/><br/> 
       <div class="editable" id="editor"> 
        Some useless content 
       </div> 
      </body> 
      </html>