首先是引入：

1. <linkhref="~/Content/summernote/dist/summernote.css"rel="stylesheet"/>
2.  <scriptsrc="~/Content/summernote/dist/summernote.js"></script>
3.  <scriptsrc="~/Content/summernote/lang/summernote-zh-CN.js"></script>  //中文包  

使用：

1. <div>
2.       <textareaid="Content"></textarea>
3.   </
   div>

初始化：

1. <script>
2.         $(document).ready(function () {  
3.             $('#Content').summernote({  
4.                 height: 400,  
5.                 minHeight: 400,  
6.                 maxHeight: 400,  
7.                 placeholder: "請輸入內容",  
8.                 lang: 'zh-CN',  
9.                 dialogsFade: true,  //模態框淡入淡出  
10.                 toolbar: [  
11.                     ['history', ['undo', 'redo']],  
12.                     ['style', ['style']],  
13.                     ['font', ['bold', 'underline', 'clear']],  
14.                     ['fontname', ['fontname']],  
15.                     ['color', ['color']],  
16.                     ['para', ['ul', 'ol', 'paragraph']],  
17.                     ['table', ['table']],  
18.                     ['insert', ['link', 'picture']],  
19.                     ['view', ['fullscreen', 'help']],  
20.                 ]  
21.             });  
22.         });  
23. </script>

修改過樣式，去掉了下拉伸縮的功能

附上一些基本用法：

編輯、只讀狀態

1. var edit = function() {  
2.   $('#Content').summernote({focus: true});  
3. };  
4. var save = function() {  
5.   var markup = $('#Content').summernote('code');  
6.   $('#Content').summernote('destroy');  
7. };  

清空

1. $('#Content').summernote('reset');  

插入內容

1. $('#Content').summernote('insertText', '內容');  

隱藏/顯示

1. $('#Content').summernote('disable');  
2. $('#Content').summernote('enable');  

1. if ($('#Content').summernote('isEmpty')) {  
2.   alert('editor content is empty');  
3. }