首页 > 软件编程 > C#教程 > C#富文本框上传文件

C#使用百度Ueditor富文本框实现上传文件

2022-07-05 07:53:49 作者：CoolDog;

这篇文章主要为大家详细介绍了C#如何使用百度Ueditor富文本框实现上传文件（图片，视频等），文中的示例代码讲解详细，感兴趣的可以了解一下

使用背景

项目中需要用的富文本框去上传视频，图片的话大部分都是可以的。相对来说，国外的富文本框很成熟。但鉴于文档是英语，这里使用了百度的富文本框。

采用的api的方式，调用接口进行上传文件。话不多说，开撸！

准备

创建一个.net mvc的项目。下载百度富文本框.net 版本的js文件。

创建项目

创建好项目之后，首先引用一下富文本框的js。目录如下：

然后新增一个单页。这里使用的 home 控制器下的index页面。代码如下：

@{
    ViewBag.Title = "Home Page";


}

<link href="~/Scripts/Ueditor-net/themes/default/css/ueditor.css" rel="external nofollow"  rel="stylesheet" />

<script src="~/Scripts/jquery-3.4.1.js"></script>
<!-- 配置文件 -->
<script src="~/Scripts/Ueditor-net/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script src="~/Scripts/Ueditor-net/ueditor.all.js"></script>




<div>
    <p>开始编辑</p>
    <textarea name="myEditor" id="myEditor" style="width:600px;height:500px"> </textarea>

</div>



<!-- 实例化编辑器 -->
<script type="text/javascript">

    $(function () {
        var editor = new baidu.editor.ui.Editor();
        editor.render('myEditor');
    });

</script>