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

 更新时间:2022年07月05日 07:55:28   作者: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>

配置项目

最后我们改一下富文本框的一些配置,点击 根目录下 Scripts 文件夹下的 Ueditor-net 文件夹 下的 ueditor.config 和 Ueditor-net 文件夹下 net 文件夹下的 config.json 。

ueditor.config.js 中 toolbars 是显示菜单的配置,按需使用即可。这个文件中关键的配置是serverUrl。这里采用的是读取本地发布的ip进行拼接的地址。

config.json 中 显示的是各个功能的配置。代码如下:

使用

配置结束后,我们打开vs 进行测试。可以看到上传图片 和上传视频 是没有 域名的。怎么办呢?

很简单,我们只需要找到image.js文件夹 找到ueditor.all.js文件夹,按照图中所示操作一下即可。

以上就是C#使用百度Ueditor富文本框实现上传文件的详细内容,更多关于C#富文本框上传文件的资料请关注脚本之家其它相关文章

相关文章

  • C#中ListView控件实现窗体代码

    C#中ListView控件实现窗体代码

    这篇文章主要介绍了C#中ListView控件实现窗体的核心代码,非常不错,具有参考借鉴价值,对c#listview相关知识感兴趣的朋友一起学习吧
    2016-08-08
  • C# 总结QueueUserWorkItem传参几种方式案例详解

    C# 总结QueueUserWorkItem传参几种方式案例详解

    这篇文章主要介绍了C# 总结QueueUserWorkItem传参几种方式案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
    2021-09-09
  • C#操作XML方法详解

    C#操作XML方法详解

    对于XML读写操作,项目中经常要用到,之前木有好好总结过,例如LINQ TO XML也用过,这篇文章主要介绍了C#操作XML的方法
    2021-11-11
  • C# Winfom 中ListBox的简单用法详解

    C# Winfom 中ListBox的简单用法详解

    这篇文章主要介绍了C# Winfom 中ListBox的简单用法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-12-12
  • C#实现WPF项目复制和移动文件夹

    C#实现WPF项目复制和移动文件夹

    这篇文章介绍了C#实现WPF项目复制和移动文件夹的方法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-03-03
  • C# 如何解析获取Url参数值

    C# 如何解析获取Url参数值

    这篇文章主要介绍了C# 如何解析获取Url参数值,帮助大家更好的理解和使用c#,感兴趣的朋友可以了解下
    2020-08-08
  • C#提高编程能力的50个要点总结

    C#提高编程能力的50个要点总结

    这篇文章主要介绍了C#提高编程能力的50个要点,较为详细的总结分析了C#程序设计中常见的注意事项与编程技巧,需要的朋友可以参考下
    2016-02-02
  • C# Windows API应用之基于FlashWindowEx实现窗口闪烁的方法

    C# Windows API应用之基于FlashWindowEx实现窗口闪烁的方法

    这篇文章主要介绍了C# Windows API应用之基于FlashWindowEx实现窗口闪烁的方法,结合实例形式分析了Windows API函数FlashWindowEx的功能、定义及实现窗口闪烁的相关技巧,需要的朋友可以参考下
    2016-08-08
  • c#数据库与TXT导入导出的实例

    c#数据库与TXT导入导出的实例

    最近刚学完ADO.NET,做了个数据导入导出的题目,是将txt中的数据导入数据库,然后将数据库中的数据导出到txt中,这里说的数据的格式是“tom|23”,tom指名字,23指年龄。废话也不多说了,大家直接看代码。
    2013-04-04
  • c# 实现观察者模式

    c# 实现观察者模式

    这篇文章主要介绍了c# 实现观察者模式的步骤,帮助大家更好的理解和使用c#实现设计模式,感兴趣的朋友可以了解下
    2021-01-01

最新评论