百度Ueditor在ASP.NET中的使用(一)

这几日在研究百度的编辑器Ueditor,刚出的,没有.NET的,我JS水平也很一般。

看了老邱的一个演示,在刚才总算是搞定了,下面简单介绍如下:

首先下载百度Ueditor(http://ueditor.baidu.com)

然后新建一个项目,UeditorDemo(ueditor.zip)

将编辑器解压为在ueditor文件夹里,放在项目根目录(当然你放哪个文件夹都可以)

然后打开ueditor文件夹下的editor_configs.js,找到第6行UEDITOR_HOME_URL: '../', 将这个路径改为你的编辑所在文件夹,例如我的在根目录的ueditor文件夹下,那我就改为UEDITOR_HOME_URL: 'ueditor/',

然后再引用editor_config.js和editor_ui_all.js和themes/default/ueditor.css到网页的head部,还有再引用一个jQuery.js(待会儿赋值时候用)

接下来在body中写如下

<div id="editorValuedata" style="display:none"></div>//这是一个隐藏的DIV,用来赋初值
<div name="editorValue" id="editorValue" ></div>//这是一个容器,用 textarea也可以,获取值也是这个
<script type="text/javascript">
var editor = new baidu.editor.ui.Editor();//实例化编辑器
editor.render("editorValue");//将编辑器渲染到容器
editor.setContent($("#editorValuedata")[0].innerHTML);//设置初始值,你可以将初始值放到<div id="editorValuedata" style="display:none"></div>内
$("#editorValuedata").remove();
</script>

然后加一个button,双击进入后台代码,在 button事件中写

ClientScript.RegisterClientScriptBlock(this.GetType(), "s", "alert('" + Request.Params["editorValue"] + "')", true);

完了,自己捣鼓吧。。。

by 小火柴

最新1.1.8.1版本使用方法见  百度编辑器UEditor1.1.8.1最新版使用之--[.NET版图片上传]

上一篇‡: ZWMOBI3.0免注册码破解版下载

下一篇‡: 百度Ueditor在ASP.NET中的使用(二)

  1. v v

    请问在MVC里面如何引用进来呢?

    1. @v:应该是一样的吧,你把上传地址改成MVC的Action试试

  2. Jon Jon

    哥,我成功了!

  3. Jon Jon

    Request.Params["editorValue"] 取的值的确一直是空的啊亲,我照搬了。

    1. @Jon:可能新版本不一样吧,我还没看过新版呢。晚上看看再做个demo

  4. Jon Jon

    失败了啊,页面是空白的。

    1. @Jon:好好看看

  5. 阿丹 阿丹

    Request.Params["editorValue"] 取的值怎么一直都是空,取不到值呢

    1. @阿丹:你完全照搬试试

  6. 还不错,把上传也写到这来吧

    1. @丿玩网:还有一篇呢

  7. 上传问题是如何解决的?
    ------------------------------
    扬州起源 http://www.yzqiyuan.com

    1. @yzqiyuan:博客里还有一篇呢。。。

最近回复