1.寫一個div，ID為Content

1 <div id="Content" class="summernoteContent">
2 
3 </div>

2.讓其成為富文本框，並且傳遞到後臺

 1 $("#Content").summernote({
 2             height: 200,
 3             lang: ‘zh-CN‘,
 4             minHeight: null,
 5             maxHeight: null,
 6             airPopover: [[‘color‘, [‘color‘]], [‘font‘, [‘bold‘, ‘underline‘, ‘clear‘]], [‘para‘, [‘ul‘, ‘paragraph‘]], [‘table‘, [‘table‘]], [‘insert‘, [‘link‘, ‘picture‘]]],
 
 7             onChange: function (e) {
 8                 $("input[id=Content]").val($(‘.summernoteContent‘).code());
 9             },
10             onChange: function (e) {    
11                 $("input[id=news_content]").val($(‘.summernoteContent‘).code());
12             },
13             onblur: function
 
 (e) {
14                 $("input[id=news_content]").val($(‘.summernoteContent‘).code());
15             },
16             onImageUpload: function (files, editor, $editable) {
17                 sendFile(files[0]);
18             },
19         });
20         function sendFile(file) { 
21             data = new
 
 FormData();
22             data.append("file", file);
23             $.ajax({
24                 data: data,
25                 type: "POST",
26                 url: "/News/Upload", //圖片上傳出來的url，返回的是圖片上傳後的路徑，http格式  
27                 contentType: false,
28                 cache: false,
29                 processData: false,
30                 success: function (data) {
31                     //data是返回的hash,key之類的值，key是定義的文件名  
32                     alert(data);
33                     //把圖片放到編輯框中。editor.insertImage 是參數，寫死。後面的http是網上的圖片資源路徑。  
34                     //網上很多就是這一步出錯。  
35                     $(‘#Content‘).summernote(‘editor.insertImage‘, "http://res.cloudinary.com/demo/image/upload/butterfly.jpg");
36                     37                 },
38                 error: function () {
39                     $(".note-alarm").html("上傳失敗");
40                     setTimeout(function () { $(".note-alarm").remove(); }, 3000);
41                 }
42             });
43         }

3.後臺接收數據並保存

 1 public ActionResult Upload()
 2         {
 3             HttpPostedFileBase Filedata = Request.Files["file"];
 4             // 如果沒有上傳文件
 5             if (Filedata == null || string.IsNullOrEmpty(Filedata.FileName) || Filedata.ContentLength == 0)
 6             {
 7                 return this.HttpNotFound();
 8             }
 9             // 保存到 ~/img 文件夾中，名稱不變
10             //string filename = System.IO.Path.GetFileName(Filedata.FileName);
11             string filename = GetImageName() + System.IO.Path.GetExtension(Filedata.FileName);
12             string virtualPath = string.Format("~/Image/NewsImg/{0}", filename);
13             // 文件系統不能使用虛擬路徑
14             string path = this.Server.MapPath(virtualPath);
15             Filedata.SaveAs(path);
16             return Json("/Image/NewsImg/" + filename);
17         }

參考博客： http://blog.csdn.net/shenyingkui/article/details/45692167

summernote上傳圖片保存路徑（C#）