asp.net使用kindeditor网页编辑器

1. 下载kindeditor,将所有内容放到放到应用程序中。比如对应地址为http://127.0.0.1/Test

2.  模拟 asp.net 的例子程序,指定一个 textarea id

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

3. 在页面中添加以下代码。

<mce:script type="text/javascript" charset="utf-8" src="kindeditor.js" mce_src="kindeditor.js"></mce:script> <mce: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(); }); } }); // --></mce:script>

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

4. 这个时候,当点击图片上传时,图片会被上传到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文件的路径。

5. asp.net的file_manager_json.ashx文件,用来处理服务器端文件的选择,可以看到两个变量

String rootPath = "../../../attached/"; String rootUrl = aspxUrl + "../../../attached/";

rootPath用来读取服务器中存储图片的文件夹中的所有图片,其目录位置相对于 file_manager_json.ashx而言。rootUrl用来显示每个文件的url,其文件位置也是相对于 file_manager_json.ashx而言。

你可能感兴趣的:(manager,function,String,upload,File,asp.net)