(ASP.NET) 利用ueditor进行图片上传（尝试3）

最新推荐文章于 2021-04-08 09:22:06 发布

江湖小小虾米

最新推荐文章于 2021-04-08 09:22:06 发布

阅读量1k

点赞数 1

分类专栏： .Net 文章标签： .net ueditor

本文链接：https://blog.csdn.net/apple8422/article/details/72625425

版权

.Net 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

前面的ckeditor以及Fileupload其实功能比较简单，而且对于新手来说使用还有点复杂，难搞。所以在此推荐百度所提供的ueditor并且以图文的方式详细解说配置。

(1)就是要下载ueditor啦，在此我下载的版本是 .NET 版的 ueditor 1.4.3.3 UTF-8下载地址下载地址，是目前最新的版本，下载解压缩后的文件结构如下图所示：

(2)接下来就是将ueditor文件夹放入到我们.Net项目当中，放哪里其实关系不大，不过我推荐将ueditor文件夹放到项目的根目录里面去，方便去调用去使用，如下图所示：

(3)VS进入项目后，找到ueditor文件夹，点击ueditor.config.js文件，找到图片下的代码。

(4)然后找到ueditor文件夹下的net文件夹里面的config.json文件，在每一项带有UrlPrefix（访问路径前缀）中按以下图片进行修改。

在啰嗦一句，这里千万别写错，若在本地运行，则写localhost:端口号（可查看，右键你的项目->选择属性->选择WEB->在服务器那里可以看到你本地的URL是什么，复制即可），若是服务器则要看清楚是不是用的外网IP地址。

(5)配置到这里，图片上传功能已经开启了，接下来在你想要用编辑器的页面调用就好，下面将给出我的模板，仅供参考。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="XXXXXXX" Inherits="XXXXXXX" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <!-- 配置文件 -->
    <script type="text/javascript" charset="utf-8" src="../ueditor/ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" charset="utf-8" src="../ueditor/ueditor.all.js"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="../ueditor/lang/zh-cn/zh-cn.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        
        <div>
            <script id="editor" name="uecontent" type="text/plain" style="height: 300px;width:100%;">
            </script>
        </div>
        <!-- 实例化编辑器 -->
        <script type="text/javascript">
            var ue = UE.getEditor('editor', {
                autoHeight: false
            });
            ue.ready(function() {
                //设置编辑器的内容
                //获取html内容，返回: <p>hello</p>
                var html = ue.getContent();
                //获取纯文本内容，返回: hello
                var txt = ue.getContentTxt();
            });
        </script>
    </div>
    </form>
</body>
</html>

(6)运行结果如下: