asp.net使用kindeditor网页编辑器

<!-- [if gte mso 9]><xml> <w:WordDocument> <w:View>Normal</w:View> <w:Zoom>0</w:Zoom> <w:PunctuationKerning/> <w:DrawingGridVerticalSpacing>7.8 磅</w:DrawingGridVerticalSpacing> <w:DisplayHorizontalDrawingGridEvery>0</w:DisplayHorizontalDrawingGridEvery> <w:DisplayVerticalDrawingGridEvery>2</w:DisplayVerticalDrawingGridEvery> <w:ValidateAgainstSchemas/> <w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid> <w:IgnoreMixedContent>false</w:IgnoreMixedContent> <w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText> <w:Compatibility> <w:SpaceForUL/> <w:BalanceSingleByteDoubleByteWidth/> <w:DoNotLeaveBackslashAlone/> <w:ULTrailSpace/> <w:DoNotExpandShiftReturn/> <w:AdjustLineHeightInTable/> <w:BreakWrappedTables/> <w:SnapToGridInCell/> <w:WrapTextWithPunct/> <w:UseAsianBreakRules/> <w:DontGrowAutofit/> <w:UseFELayout/> </w:Compatibility> <w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel> </w:WordDocument> </xml><![endif]--><!-- [if gte mso 9]><xml> <w:LatentStyles DefLockedState="false" LatentStyleCount="156"> </w:LatentStyles> </xml><![endif]--> <!-- /* Font Definitions */ @font-face {font-family:宋体; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-alt:SimSun; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:新宋体; panose-1:2 1 6 9 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:modern; mso-font-pitch:fixed; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"\@宋体"; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"\@新宋体"; panose-1:2 1 6 9 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:modern; mso-font-pitch:fixed; mso-font-signature:3 135135232 16 0 262145 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; text-align:justify; text-justify:inter-ideograph; mso-pagination:none; font-size:10.5pt; mso-bidi-font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:宋体; mso-font-kerning:1.0pt;} pre {margin:0cm; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:宋体; mso-bidi-font-family:宋体;} span.tag {mso-style-name:tag;} span.pun {mso-style-name:pun;} span.pln {mso-style-name:pln;} span.atn {mso-style-name:atn;} span.atv {mso-style-name:atv;} span.str {mso-style-name:str;} /* Page Definitions */ @page {mso-page-border-surround-header:no; mso-page-border-surround-footer:no;} @page Section1 {size:595.3pt 841.9pt; margin:72.0pt 90.0pt 72.0pt 90.0pt; mso-header-margin:42.55pt; mso-footer-margin:49.6pt; mso-paper-source:0; layout-grid:15.6pt;} div.Section1 {page:Section1;} /* List Definitions */ @list l0 {mso-list-id:2029018671; mso-list-type:hybrid; mso-list-template-ids:-681948804 67698703 67698713 67698715 67698703 67698713 67698715 67698703 67698713 67698715;} @list l0:level1 {mso-level-tab-stop:21.0pt; mso-level-number-position:left; margin-left:21.0pt; text-indent:-21.0pt;} ol {margin-bottom:0cm;} ul {margin-bottom:0cm;} --> <!-- [if gte mso 10]> <style> /* Style Definitions */ table.MsoNormalTable {mso-style-name:普通表格; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-parent:""; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin:0cm; mso-para-margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:10.0pt; font-family:"Times New Roman"; mso-ansi-language:#0400; mso-fareast-language:#0400; mso-bidi-language:#0400;} table.MsoTableGrid {mso-style-name:网格型; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; border:solid windowtext 1.0pt; mso-border-alt:solid windowtext .5pt; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-border-insideh:.5pt solid windowtext; mso-border-insidev:.5pt solid windowtext; mso-para-margin:0cm; mso-para-margin-bottom:.0001pt; text-align:justify; text-justify:inter-ideograph; mso-pagination:none; font-size:10.0pt; font-family:"Times New Roman"; mso-ansi-language:#0400; mso-fareast-language:#0400; mso-bidi-language:#0400;} </style> <![endif]-->

<!-- [if !supportLists]-->1.         <!-- [endif]-->下载 kindeditor ，将所有内容放到放到应用程序中。比如对应地址为 http://127.0.0.1/Test

<!-- [if !supportLists]-->2.         <!-- [endif]-->模拟 asp.net 的例子程序，指定一个 textarea 的 id 。

< textarea id = "your_editor_id" name = "content" cols = "100" rows = "8" style = " width:700px;height:300px; " ></ textarea >

<!-- [if !supportLists]-->3.         <!-- [endif]-->在页面中添加以下代码。

< script type ="text/javascript" charset ="utf-8" src ="kindeditor.js"></ script > < script type ="text/javascript">     KE.show({         id : 'content1' ,         imageUploadJson : '../../asp.net/upload_json.ashx' ,         fileManagerJson : '../../asp.net/file_manager_json.ashx' ,         allowFileManager : true ,          afterCreate : function (id) {              KE.event .ctrl(document, 13, function () {                   KE.util.setData(id);                   document.forms['form1' ].submit();              });              KE.event .ctrl(KE.g[id].iframeDoc, 13, function () {                   KE.util.setData(id);                   document.forms['form1' ].submit();              });          }     }); </ script >

src 为当前 aspx 文件检索到 kindeditor.js 的路径。 imageUploadJson 是相对于 plugins/image/image.html 的路径。

<!-- [if !supportLists]-->4.         <!-- [endif]-->这个时候，当点击图片上传时，图片会被上传到 kindeditor/attached 中，但是却无法显示到 textarea 中，此时查看 textarea 内容，我们会发现图片的地址为类似于 ”../attached/XXXXXX.jpg” 的形式，试想，如果 aspx 文件不处在与 attached 同级的文件夹中，图片便无法访问，所以这时我们需要修改返回的路径，在 asp.net 文件夹的 upload_json.ashx 文件中，可以看到两个变量

private String savePath = "../attached/" ;      private String saveUrl = "./attached/" ;

       savePath 用来记录存储的目录位置（相对于 upload_json.ashx 而言）。

saveUrl 则为返回的图片所在目录，为了能够在 textarea 中看到返回的图片，我们需要把 saveUrl 设置为图片文件夹相对于当前 aspx 文件的路径。