如何在一个页面添加多个不同的kindeditor编辑器

如何在一个页面添加多个不同的kindeditor编辑器,第1张

第一步: 需要把kindeditor全部加入到项目中; 第二步: 在新添加的页面..................中加入以下代码 第三步:也是比较重要的一步,在web.config需要配置一些参数。 .......节点中配置 第四步:需要注意的细节 1.在增加的时候获取字符串

<script type="text/javascript">

var options = {

filterMode : true,

allowImageUpload : false,

allowFlashUpload : false,

allowMediaUpload : false,

allowFileManager : false,

items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',

'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',

'insertunorderedlist', '|', 'emoticons', 'image', 'flash', 'media','|', 'link','unlink','fullscreen'],

width : '600px',

height: '250px'

}

var editor = new Array()

KindEditor.ready(function(K) {

editor[0] = K.create("#awards",options)

editor[1] = K.create("#description",options)

// 往下可以添加更多kindeditor...

})

</script>

注:代码中的#awards和#description是要添加kindeditor的页面元素id

Step 1. 下载KindEditor

首先到KindEditor官网下载(目前是4.1.7版本),解压后删除jsp、php、asp、examples文件夹,放入Asp.netMVC项目中的Scripts文件夹中。

Step 2. 添加HomeController

public class HomeController : Controller

{

//

// GET: /Home/

[ValidateInput(false)]

public ActionResult Index()

{

return View()

}

[ValidateInput(false)]

[HttpPost]

public ActionResult Index(string content)

{

ViewBag.Content = content

return View()

}

}

注意ValidateInput特性设置为false,否则无法插入Html标记。

Step 3. 在视图中加入KindEditor脚本

<script src="../../Scripts/kindeditor/kindeditor-min.js" type="text/javascript"></script>

<script type="text/javascript">

KindEditor.ready(function (K) {

var options = {

uploadJson: '../scripts/kindeditor/asp.net/upload_json.ashx',

fileManagerJson: '../scripts/kindeditor/asp.net/file_manager_json.ashx',

allowFileManager : true

}

window.editor = K.create('#content', options)

})

</script>

<h2>KindEditor4编辑器</h2>

@Html.Raw(@ViewBag.Content)

@using (Html.BeginForm())

{

<textarea id="content" name="content" style="width:700pxheight:300px"></textarea>

<input type="submit" value="提交" />

}

uploadJson和fileManagerJson设置值要注意路径名称

window.editor = K.create('#content', options)中的#content要与textarea标记的id一致

显示输出时,使用Html.Raw辅助方法才能正确显示Html

Step 4. 引用LitJSON.dll

项目引用KindEditor/asp.net/bin目录下的LitJSON.dll。

现在已经可以运行了。如果想要修改上传文件大小的限制,必须修改upload_json.ashx程序中的maxSize以及修改项目的Web.Config,在<system.web>中加入诸如<httpRuntime maxRequestLength="20000000" executionTimeout="3600" />(此处限制上传文件20MB)。上传的文件放置在KindEditor/attached目录下,如需修改,可分别在upload_json.ashx及file_manager_json.ashx中修改保存路径。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11742054.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-18
下一篇 2023-05-18

发表评论

登录后才能评论

评论列表(0条)

保存