.net mvc4 利用 kindeditor 上传本地图片
http://blog.csdn.net/ycwol/article/details/41824371?utm_source=tuicool&utm_medium=referral
最近在用kindeditor 编辑器,在上传本地图片的时候遇到了点问题,不能正确的上传。
现在把使用 kindeditor 上传本地图片的配置记录一下。
1、下载kindeditor。http://kindeditor.net/down.php
2、解压,将所有文件复制到项目里。我是放在content里面。
(您可以根据需求删除以下目录后上传到服务器,asp - ASP程序,asp.net - ASP.NET程序,php - PHP程序,jsp - JSP程序,examples - 演示文件)
3、将editor/asp.net/bin目录下的dll文件复制到项目bin目录下。
4、修改HTML页面
a>添加textarea输入框
- <td>@Html.TextAreaFor(a => a.contents, new { id = "editor_id" })</td>
- <!-- 或者<td><textarea id="editor_id" name="contents" >Model.contents</textarea> -->
b>在页面添加以下脚本
- <script charset="utf-8" src="~/content/editor/kindeditor.js"></script>
- <script charset="utf-8" src="~/content/editor/lang/zh_CN.js"></script>
- <script>
- KindEditor.ready(function (K) {
- window.editor = K.create('#editor_id', {
- width: '600px',
- height: '400px',
- items: ['source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'cut', 'copy', 'paste', '|',
- 'justifyleft', 'justifycenter', 'justifyright', '|',
- 'insertorderedlist', 'insertunorderedlist', 'clearhtml', 'quickformat', '|',
- 'anchor', 'link', 'unlink', '|', 'fullscreen', '/',
- 'formatblock', 'fontname', 'fontsize', '|',
- 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline', 'lineheight', 'removeformat', '|',
- 'image', 'multiimage', 'flash', 'media', 'insertfile', '|',
- 'table', 'hr', 'emoticons', 'baidumap'],
- //uploadJson: '~/content/editor/asp.net/upload_json.ashx', //在网上需要配置这句,但是注释了才不报错...只需要下面的
- fileManagerJson: '~/content/editor/asp.net/file_manager_json.ashx',
- });
- });
- </script>
如果你改变了 editor 的文件位置,要修改一下 upload_json.ashx 、 file_manager_json.ashx 的保存路径。我的是默认的。
找到plugins文件夹下的image文件夹,下面有个image.js文件,默认是php的,要修改为asp.net。
上传本地图片时,路径会显示C:\fakepath\***,显示fakepath是正常的,出于安全考虑,是无法获取真实路径的。
最后上效果图:
.net mvc4 利用 kindeditor 上传本地图片的更多相关文章
- KindEditor上传本地图片在ASP.NET MVC的配置
http://www.cnblogs.com/upupto/archive/2010/08/24/1807202.html 本文解决KindEditor上传本地图片在ASP.NET MVC中的配置. ...
- kindeditor上传本地图片实例
所需插件:kindeditor下载 密码: 5ry4 jsp文件: <script type="text/javascript" language="javas ...
- tinymce4.x 上传本地图片(自己写个插件)
tinymce是一款挺不错的html文本编辑器.但是添加图片是直接添加链接,不能直接选择本地图片. 下面我写了一个插件用于直接上传本地图片. 在tinymce的plugins目录下新建一个upload ...
- tinymce4.x 上传本地图片 (转载)
转载自:http://www.cnblogs.com/fhen/p/5809514.html tinymce4.x 上传本地图片 tinymce是一款挺不错的html文本编辑器.但是添加图片是直接 ...
- 个人永久性免费-Excel催化剂功能第102波-批量上传本地图片至网络图床(外网可访问)
自我突破,在100+功能后,再做有质量的功能,非常不易,相对录制视频这些轻松活,还是按捺不住去写代码,此功能虽小,但功课也做了不少,希望对真正有需要的群体带来一些惊喜. 背景介绍 图床的使用,一般是写 ...
- html5上传本地图片,在线预览及裁剪(filereader,canvas)
1 我们常常需要上传头像,点击上传按钮时候需要预览一下,使用filereader方法无需和后台交互,代码如下: //本地图片在上传之前的预览效果 //图片上传预览 function previewIm ...
- 有道云笔记Markdown上传本地图片的方法
有道云笔记截图&保存 方法有多种,例如:开通有道云笔记VIP会员.先将图片文件上传到有道云笔记后使用图片的分享链接.说到底还是使用的 Markdown 的图片功能 [root@115~~]#git branch -av 创建分支(比如de ...
- FusionCharts V3图表导出图片和PDF属性说明(转)
百闻不如一见,狠狠点击,快快下载:(演示文档有错误,不提供下载了.待新的演示文档出来.) 许多朋友说上面的DEMO用不了.fusioncharts官方的演示非常不错,就是来不及整理,各位大侠们可以研究 ...
- 【转】【WPF】WPF 自定义快捷键命令(Command)
命令简介 WPF 中的命令是通过实现 ICommand 接口创建的.ICommand 公开两个方法(Execute 及 CanExecute)和一个事件(CanExecuteChanged).Exec ...
- C# 通过消息捕获处理窗体最大化/最小化
通过以下的一些代码可以实现捕获相关的一些消息事件; 以及可以通过调用 SetCloseMenu();实现关闭一些按钮功能如屏蔽关闭按钮功能等; 需要添加命名空间:using System.Runtim ...
- U3D physics总结
物理系统基于collider, 没有collider的物体不会发生任何主动和被动的物理交互,也不会产生trigger相关消息. 当且仅当A和B都有碰撞体时,两者才有可能发生交互,才有可能产生trigg ...
- 微信公众平台JSSDK开发
根据微信开发文档步骤如下: 1.先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”.JS接口安全域名设置 mi.com(前面不用带www/http,域名必须备案过) 2.引入 ...
- Caffe学习系列(6):Blob,Layer and Net以及对应配置文件的编写
深度网络(net)是一个组合模型,它由许多相互连接的层(layers)组合而成.Caffe就是组建深度网络的这样一种工具,它按照一定的策略,一层一层的搭建出自己的模型.它将所有的信息数据定义为blob ...
- [CareerCup] 5.6 Swap Odd and Even Bits 交换奇偶位
5.6 Write a program to swap odd and even bits in an integer with as few instructions as possible (e. ...
- LINUX信息安全系统设计基础第二周学习总结
1 Linux命令 2 man命令 1.Terminal(终端) Linux 系统还提供了一个叫做终端模拟器的程序(Terminal),下面几个比较常见的终端模拟器,例如 gnome-terminal ...
- WPF Command Binding
<Window x:Class="WpfTest.MainWindow" xmlns="http://schemas.microsoft.com/winfx/200 ...