精华内容
下载资源
问答
  • 2019-09-04 00:32:34

    打开ftp时,总是自动跳转到浏览器,而且按百度上设置了**“启用FTP文件夹视图”,甚至修改注册表**都无效!使用IE浏览器打开时还会显示:

    “若要在文件资源管理器中查看此 FTP 站点,请单击“视图”,然后单击“在文件资源管理器中打开 FTP 站点””

    然而,都找不到视图的按钮在哪!!!更别说能使用资源管理器打开了。。。

    解决方法:

    本人电脑是win7系统64位,参照了英文网页的大神们解答,完美修复!
    英语网页链接:
    https://social.technet.microsoft.com/Forums/ie/en-US/3d74bc03-b0c4-4ec1-88df-b938ec82c159/this-ftp-site-cannot-be-viewed-in-windows-explorer-8?forum=ieitprocurrentver
    根据里面的信息,原来原因一般是由于安装过chrome浏览器后卸载导致的问题。

    下面开始修复:

    • 使用txt文本编辑器,直接创建一个ftp.reg文件(创建的txt文件修改后缀)
    • 右击编辑
    • 将以下代码复制粘贴到ftp.reg文件中,保存退出
    Windows Registry Editor Version 5.00
    
    [HKEY_CLASSES_ROOT\ftp]
    @="URL:File Transfer Protocol"
    "AppUserModelID"="Microsoft.InternetExplorer.Default"
    "EditFlags"=dword:00000002
    "FriendlyTypeName"="@C:\\Windows\\system32\\ieframe.dll,-905"
    "ShellFolder"="{63da6ec0-2e98-11cf-8d82-444553540000}"
    "Source Filter"="{E436EBB6-524F-11CE-9F53-0020AF0BA770}"
    "URL Protocol"=""
    
    [HKEY_CLASSES_ROOT\ftp\DefaultIcon]
    @=hex(2):25,00,53,00,79,00,73,00,74,00,65,00,6d,00,52,00,6f,00,6f,00,74,00,25,\
      00,5c,00,73,00,79,00,73,00,74,00,65,00,6d,00,33,00,32,00,5c,00,75,00,72,00,\
      6c,00,2e,00,64,00,6c,00,6c,00,2c,00,30,00,00,00
    
    [HKEY_CLASSES_ROOT\ftp\shell]
    @="open"
    
    [HKEY_CLASSES_ROOT\ftp\shell\open]
    
    • 双击运行ftp.reg,完成注册表的更新
    • 修复完成
    更多相关内容
  • 导读:俗话说,磨刀误砍柴工,要想闯荡编程世界,一套趁手的编辑器是必可少的。对 Python 语言的使用者来说,不论你是刚开始学习编程知识的萌新小蛇,还是已经有了许多编程经验的巨蟒大佬,今天介绍的这款神器,...

    导读:俗话说,磨刀不误砍柴工,要想闯荡编程世界,一套趁手的编辑器是必不可少的。对 Python 语言的使用者来说,不论你是刚开始学习编程知识的萌新小蛇,还是已经有了许多编程经验的巨蟒大佬,今天介绍的这款神器,一定能给你的学习、工作带来许多助益。

    ——当然,前提是你能正常访问 Google 的服务。

    作者:欧剃

    来源:优达学城Udacity(ID:youdaxue)

    01 我需要什么样的编辑器?

    世上并不存在绝对完美的编辑器,但就日常使用需求而言,起码需要满足以下几点,才算是一款“老少咸宜”的优秀的编辑器:安装配置难度低:用户不需要很复杂的设置或调整系统选项,就能运行良好。相比之下,一些功能强大的专业 IDE 例如 Eclipse 就需要耗费许多时间进行安装和配置。

    易用性好:学习曲线一定要平缓,不能一来就把新用户给吓跑了。VIM 编辑器可以说是非常厉害了,然而第一次使用的时候,你可能连退出都搞不定。

    功能强大:除了必备的代码着色,各种运行调试功能也不能少。想来应该不会有人用记事本写代码吧?

    包括版本管理或团队协作功能:其实这算是一个锦上添花的功能,团队协作能让多人共同完成任务,版本控制可以让你方便地追踪回退你的代码版本,这也为开发大规模应用打下良好的基础。

    好了,卖了这么多关子,下面容我向你郑重推荐这款超强的 Python 编辑器——Google Colaboratory!

    02 这就是个网页!?

    没错,Colab 是一个免费的 Jupyter Notebook 环境(你可以想成是网页版多功能笔记本),它不需要进行任何设置就可以使用,并且完全在云端运行。

    你可以在这个网页上编写和执行代码、保存和共享分析结果,并利用 Google 提供的强大计算资源处理数据,所有这些都可通过浏览器免费使用。

    别不相信,我这就带你详细了解一下:

    1. 界面友好

    在详细介绍它的强大功能之前,我们先来认识一下 Colab 的界面。

    和 Jupyter Notebook 一样,Colab 的编辑界面也是以“单元格”为基本单位,每个单元格都是“代码”或“文字”其中之一。

    代码单元格自带代码着色,可以开启行号显示、缩进字符调整等功能,还能直接在页面上运行代码,运行结果会直接显示在代码单元格下方。除了 Python 代码外,Colab 还支持解析 html 标记,运行 bash 命令等。

    如果代码有问题,则会显示一些精心着色并格式化了的错误信息,帮助你找到出错的地方——甚至还很贴心地提供了一个“一键求助”按钮,让你能在 stackoverflow.com 上搜索对应的出错信息。

    文字单元格用于在代码之间添加描述性文字,你可以用它解释代码内容、做笔记、写论文,你可以用 Markdown 标记语言来给单元格内的文字添加格式,甚至插入图片等。

    这种图文并茂,代码和数据交相辉映的显示方式,非常适合学习 Python 的新手,以及搞数据分析的科学家们。

    怎么样,在这样的界面上写代码是不是很简洁明快呀?

    此外,作为一个网页版的编辑器,它无需安装和过多配置,基本上达到了“开箱即用”,写完就能运行的效果,降低了初学者入门的门槛,也节省了老手开始工作前的配置时间。

    再加上云服务天生的跨平台跨设备特性,不管是台式机、笔记本、平板电脑甚至手机,只要有网络的地方,你都能随时继续手头的工作,绝对不会丢失数据。

    2. 功能强大

    在平易近人的外表下,隐藏的是一颗强大的芯。

    在代码中,你不但可以用 Python 语言引入各种标准库供你使用,还可以利用 bash 语言的支持,手动安装你需要的各类第三方库。甚至连数据分析用的 Pandas、Numpy,机器学习的 TensorFlow 等都已经内置了。

    不仅如此,和跑在自己电脑上的 Jupyter Notebook 环境最大不同之处是,Colab 使用的是 Google 的后台运行时服务,这就相当于你拥有了一台随时待命的专属服务器。这个服务器自带有 12G的内存和50G的硬盘空间,用于容纳、处理你的数据和代码。

    比如,当你在坐车或者是无聊的会议当中的时候,突然想到一个点子,“我这样构建我的模型行不行?”在以往,只有轻便的上网本或者手机的时候,虽然这些设备的算力可以解决一些微小数据集上的问题,但如果要将模型用于大数据集的时候肯定是需要额外算力的。

    那么在 5G 网络等等的基础上,你可以用手机通过 Colab 直接连上服务器,用 Google 的算力来运算你对模型的调整。

    为了用户能更高效地运行调整机器学习代码,Google 还提供了一些 GPU(Tesla K80)和 TPU(据说是八核心的TPU v2)的加速硬件,你只需要在笔记本设置里启用,就可以用到这些额外的运算能力——按照机器之心网站的测试,用 CPU 迭代一次需要运行 2.44 秒的代码,用 GPU 只需要约 280 毫秒,而通过修改代码调用 TPU 进行运算,类似的工作量只需要 1.22 毫秒!这几乎快了 2000 倍呢!

    最后,Google Colab 最大的优势还在于,它通过云计算让用户摆脱了装备的限制,再也不用担心自己的电脑太烂,不管什么设备,只要能连上 Google 的网络服务,就可以使用云端的虚拟机,处理云端的数据集。

    当然,如果你嫌 Google 提供的运行时不够快,或是需要长时间挂着执行高速运算,你也可以在界面上选择连接到电脑本地的代码执行程序,用你自定义的软件/硬件来处理你存放在 Colab 上的代码。

    3. 协作与代码管理

    实时协作可以算是 Google 一向的强项啦。在 Colab 里,你可以像分享普通的 Google 文档或电子表格一样,通过邮件邀请或是分享链接的方式,让其他人阅读/参与到你的代码工作中来。

    你也可以通过往 Google 云端硬盘上传/下载笔记本文件(.ipynb)的方式,分享、保存、发送你的笔记本的所有内容(文本、代码和输出项)。当然,你可以在“笔记本设置”里选择在保存或分享笔记本时忽略代码单元格输出项,让页面更加简洁。

    此外,Colab 还支持基于检查点的历史版本管理,你可以方便地回退历史记录,查询修改情况,还能接入 Github 代码库,把代码上传到 Github 仓库或者 gist 里,管理、共享你的代码和分析成果。

    4. 有趣的小彩蛋

    最新版本的 Colab 支持换肤功能(……),你可以在设置里选择深色或者浅色的主题背景(据说深色主题能大大增强你的编程水平),选择柯基模式会让你的标题栏出现两只奔跑的柯基,选择威力等级(超强power模式),可以让你的每次键盘输入都震动整个窗口……

    03 我能用它做什么?

    如果你是刚开始学习 Python 的新人,那它是你入门学习语言的最好工具之一。无需安装配置,即开即用的 Python 环境,能让你方便快捷地测试自己的学习代码,并且在同一个页面里直观地看到程序的输出内容。这能够极大地加快试错和探索的速度,让你更快地掌握新语言的特性。

    如果你是计算机专业的教师,Colab 甚至提供了一套布置、批改作业的系统,利用笔记本能把题目、代码、运行结果整合在同一个页面上的功能,你可以方便地查看每道问题的作答情况,并对具体单元格进行审阅、批注、打分。

    如果你是计算机科学家,Colab 这种自带云计算、方便协作的环境能极大地提高你的工作效率。

    在数据分析方面,Google 给出了在 Colab 里使用 Pandas 处理数据,并进行分析的详细教程,你可以使用类似的方法读取在线数据集中的数据,并进行分析。

    在神经网络框架方面,TensorFlow 官方就放出了几个例子,其中让人最印象深刻的是在 Colab 上调用神经网络自动分析图像识别癌症的实例。

    此外,对于机器学习的研究者,在实际工作中往往会遇到“在什么时候该用什么样的模型”的问题,特别是在调试具体模型时,往往会有很多操作细节是调用者所不明白的。在这种情况下,云计算端口能够提供的是一个合作的窗口,通过共享工作笔记本的形式,其他人可以直接对你的模型提出具体的调整建议。

    怎么样,对这个超强的“大玩具”,你心动了吗?

    快去colab.research.google.com试一试吧!

    展开全文
  • 简单html网页的快速编辑方法

    千次阅读 2021-06-16 09:50:38
    简单html网页的快速编辑方法现在互联网上大多数网页都是由html编写的,html网页还算是比较... 首先桌面上新建一个快捷文本文档(后缀名为.txt),(这里我们就重命名为网页)2. 打开刚刚新建的文本文档,开始编辑ht...

    简单html网页的快速编辑方法

    现在互联网上大多数网页都是由html编写的,html网页还算是比较简单上手的,我们用html配合css布局和javascript特效就可以做成各种各样的精致漂亮网页。下面小编就用txt文本来教大家编辑一个简单的html网页。

    具体操作步骤如下:

    1. 首先在桌面上新建一个快捷文本文档(后缀名为.txt),(这里我们就重命名为网页)

    05f1d5cbb3794c520f93742d0d28875a.png

    2. 打开刚刚新建的文本文档,开始编辑html源码,先编辑html开始标签和结束标签,即输入头和尾即开始和结束标签,中间的是标签的主要内容

    9316bc012ef75e777a99aed8def28f3b.png

    3. 然后在开始标签和结束标签中间先加入这次的标题

    7e54e67e06332d6e6438e3e121558fb4.png

    4. 再在刚刚的标题后加入一级标题,这里内容编辑为为biao ti

    e4ab84d738a2e61840ff91b22d8e173a.png

    5. 然后我们可以用相同的方法添加下面的段落,这里先编辑内容duanluo

    aeb300b1c24c13a941a017ffd6240850.png

    6. 最后点击保存,就可以保存输入的网页代码,然后将文本文档后缀名改为.html,这样我们打开就可以是网页形式

    40cf4e2c18188455e7ffe51bcd6ab1a6.png

    7. 重新打开刚刚的文本文档(现在是.html格式文件),就可以看到制作的网页的内容是什么

    937b65ecf2fe79e69b63534e097928e2.png

    以上就是小编教大家的简单html网页的快速编辑方法,没想到可以这么快速简单就可以编辑一个网页吧,不知道大家学会了没有。

    时间:2018-10-17 14:25 / 作者:百科全说

    5a63401d8fa2306cf372be578c407841.gif

    在日常的电脑使用当中,担心某些重要文件丢失,需要在另一个磁盘多备份一份。通常采用的方法是复制和粘贴,有的人甚至在同一个对话框里来回前进、后退进行寻找目标,或者打开几个磁盘对话框,这样的操作面免不了麻烦。下面我给大家介绍一种比较简单、快速的备份操作方法,希望对大家有所帮助。 工具/原料 电脑、资源管理器 方法/步骤 第一步、打开资源管理器。常用有2种方法: 1、选定“我的电脑”图标——单击“右键”弹出下拉菜单——选中“资源管理器“打开,如下图 2、双击”我的电脑“图标弹出对话框——选定某一磁盘单击

    5a63401d8fa2306cf372be578c407841.gif

    什么是宏命令?怎么使用宏命令?宏命令:即通过特殊的控制语,将一系列动作简便化、集成化;即:一种批处理的程序。如果还是不懂,小木就教大家如何使用“宏”吧,这里我使用word 2010做一个实例,其他office软件使用宏命令的操作,大家照葫芦画瓢吧。其实,写了那么多计算机技巧,始终坚持一个理念:简单机械的操作还是交给电脑来完成吧。大家就get好这些技能吧。 方法/步骤 1、新建一个word 文档,命名为“百度经验@小木”。打开完成的页面如图,点击“视图”,然后点击“宏”->“录制宏”。今天我

    02/26 21:02

    5a63401d8fa2306cf372be578c407841.gif

    经常有电脑爱好者朋友由于不小心误操作导致电脑浏览网页时出现了字体变大或变小等,导致使用不习惯。今天编辑与大家简单介绍下网页字体大小怎么设置。 步骤方法  1、其实很多朋友出现网页字体变大或变小都是错误的调整到了网页的缩放比例导致的,正常网页缩放比例是100%,在浏览网页的最右下角可以看到缩放的比例,如果是比例设置不正常,那么网页字体肯定显示不是正常大小了,如下图: 2、如上图所看到的就是正常情况下网页所显示的100%缩放网页字体显示大小,如果调节成75%字体就会变的小了不少,如下

    5a63401d8fa2306cf372be578c407841.gif

    从Word2010版本开始,基本编辑操作大体上一致,包括段落间距的设置等.一般的行和段落间距可以快速设置,下面小编就为大家详细介绍一下,来看看吧. 步骤 1.首先,定位到需要设置行间距的段落: 2.再单击“开始”选项卡下的“行和段落间距”按钮,选择需要的数值即可: 3.而如果你需要详细设置间距,如段前段后间距,则可以选择最下面两项之一: 4.需要精确设置,则可以选择“行距选项”: 5.或者单击“段落设置”按钮: 6.从“段落”对话框中的“间距”进行精确设置: 7.在“段落”对话框中设置完成后单击

    5a63401d8fa2306cf372be578c407841.gif

    在试卷编辑过程中,选择题答案每次要输入ABCD字母,而且要用空格定位答案的位置,操作比较麻烦,而且速度慢.下面小编就为大家介绍如何用制作位可以轻松的完成定位和ABCD项目的输入方法,一起来看看吧. 一.新建文件,绘制制表位. 1.建立新文件. 建立一个新的WORD文件,保存. 输入第一个选择题的题目内容. 2.显示标尺. 有的文件默认没有显示标尺. 打开视图工具栏,选择标尺,就可以看到文档上部显示标尺. 3.绘制制表位. 在标尺的下边的位置,点击就可以添加一个制作位标记. 制表位的位置是答案的起

    5a63401d8fa2306cf372be578c407841.gif

    微群组怎么升级?下文将告诉大家微群组快速升级方法,如何才能够提升自己的等级呢?其实很简单哦~下面就让我们详细了解升级微群组的一些技巧吧。 ● 每天首次打开,经验+12; ● 每天首次组内发言,经验+3(多组可累加,但每天最多+24)。

    5a63401d8fa2306cf372be578c407841.gif

    Word转成网页方法 将Word文档保存或另存为“htm或html”格式即可。 找到刚才保存的路径,自己双击打开看看,是不是已经是网页呢!方法很简单嘛!当然这是Word2003转换的方法,如果是Word2007可以参考(Word2007文档另存为网页格式的方法)。 网页转Word的方法 上面给大家讲解了“Word转成网页”的技巧,操作只需要一步就OK。下面在来说说“网页转换成Word”方法,方法也是蛮简单的! 第一步、打开网页后单击浏览器菜单栏的“文件”-->另存为

    5a63401d8fa2306cf372be578c407841.gif

    Windows 7正式发布的日子越来越近了,想要使用,您准备好了吗?尽管Windows 7在功能和界面上有了新颖的设计,对于长期坚守XP甚至还没有尝试过Vista的用户来讲,是否就能快速上手,恐怕还得适应一番才能下定论。尽管有些文章宣称Windows 7在硬件的兼容性上已经超过了90%,但对于那些“偏门”的配置,是否就能一步安装到位呢?对于生手,您是否更加倾向于双系统或者多系统同时存在?也许您并不喜欢Windows 7,又打算卸载后重新装回熟悉的系统。接下来就一起看看该怎么对付这个微软新一代系统

    5a63401d8fa2306cf372be578c407841.gif

    我们使用电脑时会遇到某些文件和文件夹不能删除或者不能更改,提示我们需要来着管理员的权限,今天我教教大家快速设置文件夹权限的方法。 工具/原料 win7/win8电脑 方法/步骤 1、首先找到没有权限的文件夹,右键单击该文件夹选择属性。 2、在属性里选择安全选项卡。 3、鼠标左键单击安全选项卡里的编辑。 4、在弹出的对话框里选择添加进入到选择用户或组。 5、在选择用户或组里点左下角的高级。 6、在新弹出的高级的选择用户或组里点击右方的立即查找,然后下方搜索结果会出现电脑上所有的用户或组。 7、在下

    展开全文
  • 人力资源管理软件(完全免费)

    千次下载 热门讨论 2011-03-08 11:36:20
    解决了人力资源管理软件合同管理新增编辑时合同类型符合的问题。 人力资源管理软件解决了合同类型定义里面的自定义扩展属性删掉的问题。(感谢☆缘☆) 2008-04-09 人力资源管理软件发布1.5版本,做了以下改进...
  • UEditor是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码。 本文以最新版本的1.4.3.3版本为教程来讲述 具体文档...

    UEditor简介

    UEditor是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码。

    本文以最新版本的1.4.3.3版本为教程来讲述

    具体文档参见:http://fex.baidu.com/ueditor/

    135编辑器简介

    135编辑器是一款提供微信公众号文章排版和内容编辑的在线工具,样式丰富,支持秒刷、收藏样式和颜色、图片素材编辑、图片水印、一键排版等功能,轻松编辑微信公众号图文。他是一款基于UEditor富文本的编辑器,一共分为两种类型,一种是免费类型的嵌入型,也就是把135编辑器嵌入到UEditor富文本里面的菜单中,还有一种就是收费类型的无缝嵌入,这种会把135编辑器整体嵌入到个人或企业的内容编辑区域,在下图给大家看出来他们的区别。

    免费版:

    免费版

    收费版:

    收费版

    使用优势

    功能UEditor135编辑器
    上传图片需配置上传图片的选项无需配置(上传的图片由135编辑器返回超链接,你无需配置)
    上传视频需配置上传视频的选项无需配置(上传的视频由135编辑器返回超链接,你无需配置)
    上传音乐需配置上传音乐的选项无需配置(上传的音乐由135编辑器返回超链接,你无需配置)
    大多数功能需配置大多数功能的选项无需配置(大多数功能由135编辑器返回超链接,你无需配置)

    安装UEditor

    由于135编辑器是基于UEditor富文本的所以需要先安装UEditor富文本来支持135编辑器的嵌入,此方法只针对于免费使用135编辑器的人群,如果你是要付费使用的话你可以联系135编辑器的人,他们会有专门的技术人员提供技术支持。

    下载UEditor编辑器

    这里我是使用Flask来作为后端程序,如果你使用UEditor官网所指定的程序的话可以直接看UEditor的文档,访问UEditor首页,下载1.4.3.3 PHP UTF-8版本的UEditor,并解压到Flask应用程序的static目录。解压之后的目录结构是这样的:

    |+static/
    | |+ueditor/
    | | |+dialogs/
    | | |+lang/
    | | |+php/ #因为我是Flask,所以这个目录中只有config.json对我有用,我已经把他放到了ueditor目录里面
    | | |+themes/
    | | |+third-party/
    | | |-config.json
    | | |-index.html
    | | |-ueditor.all.js
    | | |-ueditor.all.min.js
    | | |-ueditor.config.js
    | | |-ueditor.parse.js
    | | |-ueditor.parse.min.js

    +代表目录
    -代表文件

    在index.html中加入UEditor:

    因为我是Flask程序,所以需要在templates目录中新建一个index.html的文件,你们可以根据自己语言和框架来选择文件建在那个目录中。

    在index.html文件的head标签中加入下面几行:

    <script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/ueditor.config.js') }}"></script>
    <script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/ueditor.all.min.js') }}"> </script>
    <!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/lang/zh-cn/zh-cn.js') }}"></script>
    <style>
        .edui-button.edui-for-135editor .edui-button-wrap .edui-button-body .edui-icon{
            background-image: url("http://static.135editor.com/img/icons/editor-135-icon.png") !important;
            background-size: 85%;
            background-position: center;
            background-repeat: no-repeat;
        }
        .edui-default{
            width: 920px;
            margin: 0 auto;
        }
    </style>
    

    在body标签加入:

    <script id="editor" type="text/plain"></script>
    <script type="text/javascript">
        //实例化编辑器
        //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
        var ue = UE.getEditor('editor', {
            serverUrl: "/upload/"
        });
    </script>
    

    请求路径配置:

    UEditor 1.4.2+ 起,推荐使用统一的请求路径,在部署好前端代码后,需要修改 ueditor.config.js 里的 serverUrl 参数(或者初始化时指定,见上面的代码),改成 ‘/upload/’ 。

    UEditor初始化时,会向后端请求配置文件,后端收到请求后返回JSON格式的配置文件。具体实现参照后面的代码。

    详细配置内容参见文档。

    创建Flask应用程序(app.py):
    # -*- coding: utf-8 -*-
     
    from flask import Flask, render_template
     
    app = Flask(__name__)
     
    @app.route('/')
    def index():
        return render_template('index.html')
     
    @app.route('/upload/', methods=['GET', 'POST'])
    def upload():
        pass
     
    if __name__ == '__main__':
        app.run(debug=True)
    

    应用程序运行之后,我们访问 http://localhost:5000/ 就可以看到UEditor编辑器了,上图:
    UEditor编辑器

    UEditor后端请求规范说明

    与后台通信的功能列表:
    • 上传图片
    • 拖放图片上传、粘贴板图片上传
    • word文档图片转存
    • 截图工具上传
    • 上传涂鸦
    • 上传视频
    • 上传附件
    • 在线图片管理
    • 粘贴转存远程图片
    统一请求格式说明:
    • 前端请求通过唯一的后台文件 /upload/ 处理前端的请求
    • /upload/通过GET上的action参数,判断是什么类型的请求
    • 省去不必要的请求,去除涂鸦添加背景的请求,用前端FileReader读取本地图片代替
    • 请求返回数据的格式,常规返回json字符串,数据包含state属性(成功时返回’SUCCESS’,错误* 时返回错误信息)。
    • 请求支持jsonp请求格式,当请求有通过GET方式传callback的参数时,返回json数据前后加上括* 号,再在前面加上callback的值,格式类似这样:
      cb({“key”: “value”})

    详细说明:http://fex-team.github.io/ueditor/#dev-request_specification

    Flask实现后端请求

    获取配置信息

    由于接口升级,编辑器初始化时,首先会向后端请求配置信息,后端收到请求后,返
    回相应的配置信息即可。

    请求参数:
    GET {"action": "config"}
    POST "upfile": File Data
    
    返回格式:
    // 需要支持callback参数,返回jsonp格式
    {
        "imageUrl": "http://localhost/ueditor/php/controller.php?action=uploadimage",
        "imagePath": "/ueditor/php/",
        "imageFieldName": "upfile",
        "imageMaxSize": 2048,
        "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"]
    }
    
    主要功能代码:
    @app.route('/upload/', methods=['GET', 'POST'])
    def upload():
        action = request.args.get('action')
     
        # 解析JSON格式的配置文件
        # 这里使用PHP版本自带的config.json文件
        with open(os.path.join(app.static_folder, 'ueditor', 'php','config.json')) as fp:
            try:
                # 删除 `/**/` 之间的注释
                CONFIG = json.loads(re.sub(r'\/\*.*\*\/', '', fp.read()))
            except:
                CONFIG = {}
     
        if action == 'config':
            # 初始化时,返回配置文件给客户端
            result = CONFIG
     
        return json.dumps(result)
    

    这样的话就不会有什么问题出现了。

    安装135编辑器

    现在可以开始安装135编辑器了,因为笔者没有钱,所以使用的是免费版的135编辑器,所以他是嵌入在UEditor里面的,并且通过笔者不断观察135编辑器的网站和严格的一致性,导致笔者的UEditor和135编辑器的UEditor一模一样,在下面开始分享给大家。

    安装插件

    将插件的两个文件下载到项目ueditor对应的目录里,并将135editor.js加载到自己的网页中

    http://www.135editor.com/js/ueditor/plugins/135editor.js
    http://www.135editor.com/js/ueditor/dialogs/135editor/135EditorDialogPage.html

    加载135editor.js

    在index.html中的body标签中加入135editor.js文件

    <script id="editor" type="text/plain"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='ueditor/plugins/135editor.js') }}"></script>
    <script type="text/javascript">
        //实例化编辑器
        //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
        var ue = UE.getEditor('editor', {
            serverUrl: "/upload/"
        });
    </script>
    
    重写themes目录下的iframe.css文件
    @charset "utf-8";
    html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;line-height: 1.6;background: #FFF;height:100%;}
    * {-webkit-max-logical-width: 100%;margin:0;padding:0;box-sizing: border-box!important;-webkit-box-sizing: border-box!important;}
    body{-webkit-touch-callout:none;position: absolute; width: 100%;margin: 0;padding: 15px !important;font-size:16px;overflow-x:hidden;font-family:'微软雅黑','Microsoft YaHei',Arial,sans-serif;background-color:#FFF;line-height:inherit;height:100%;}
    p{clear:both;margin:0 0;white-space: normal;}
    img{*zoom:1;max-width:100%;*max-width:96%;height:auto !important;}
    iframe{width:100% !important;border:0;background-color:inherit;}
    .vote_area{display:block}
    .vote_iframe{height:100%;width:100%!important;*width:96%!important}
    .qqmusic_iframe{width:100%!important;height:75px;background-color:#fcfcfc;}
    .audio_iframe{width:100%!important;background-color:#fcfcfc;height:82px}
    .blockquote_iframe{width:100%!important;height:64px}
    .blockquote_tips_iframe{width:100%!important;height:42px}
    .video_iframe{background-color:#000;width:100%!important;*width:96%!important;position:static}
    .shopcard_iframe{width:100%!important;height:95px;margin:14px 0}
    .topic_iframe{width:100%!important;height:118px;margin:14px 0}
    .weapp_app_iframe{height:330px;margin:14px 0}
    
    body{cursor:text;}
    a{color:#607fa6;text-decoration:none}
    .guide{background-repeat:no-repeat;background-image: url(https://image.135editor.com/files/users/0/1/201708/xvCbQwOV_Ofmg.png);}
    [contenteditable] {  caret-color: red;}
    ::-webkit-scrollbar {width:6px;height:6px;background: #f1f1f1;}
    ::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 0 0 16px #c1c1c1;}
    ::-webkit-input-placeholder {color:    #ddd;}
    * {
    outline:0 none !important; blr:expression(this.onFocus=this.blur());
    }
    *:focus {
        outline: none !important;
    }
    
    li.placeholder {
        position: relative;list-style-type: none;
        margin: 0;
        padding: 0;
        border: none;
    }
    li.placeholder:before {
        position: absolute;
        content: " ";
        width: 0;
        height: 0;
        margin-top: -5px;
        left: 0px;
        top: -4px;
        border: 8px solid transparent;
        border-left-color: red;
        border-right: none;
    }
    .dragged {
        position: absolute !important;
        top: 0;
        opacity: 0.5;
        z-index: 2000;
    }
    
    .hiddenIn135{display:none !important;visibility: hidden !important;}.showIn135{display:initial !important;opacity: 1 !important;    visibility: visible !important;}
    .hoverimg:hover{background:#000;}
    
    blockquote{margin:0;padding-left:10px;border-left:3px solid #DBDBDB;}
    
    ol,ul,dl
    {
    	/* IE7: reset rtl list margin. (#7334) */
    	*margin-right: 0px;
    	/* preserved spaces for list items with text direction other than the list. (#6249,#8049)*/
    	padding: 0 0 0 30px;
    }
    
    table.noBorderTable td,table.noBorderTable th,table.noBorderTable caption{border:1px dashed #ddd;}
    table{margin-bottom:10px;border-collapse:collapse;display:table;width:100%;margin:0 auto;}
    td,th{word-wrap:break-word;word-break:break-all;padding:5px;border:1px solid #DDD}
    caption{border:1px dashed #DDD;border-bottom:0;padding:3px;text-align:center}
    th{border-top:2px solid #BBB;background:#f7f7f7}
    .ue-table-interlace-color-single{background-color:#fcfcfc}
    .ue-table-interlace-color-double{background-color:#f7faff}
     td p{margin:0;padding:0;width:auto;height:auto;}
    
    hr{border: 0px;border-top: 1px solid #ccc;}
    img:hover {z-index:-1;cursor:pointer;}
    pre{
    	white-space: pre-wrap; /* CSS 2.1 */
    	word-wrap: break-word; /* IE7 */
    }
    .marker {
    	background-color: Yellow;
    }
    
    figure {
    	text-align: center;
    	border: solid 1px #ccc;
    	border-radius: 2px;
    	background: rgba(0,0,0,0.05);
    	padding: 10px;
    	margin: 10px 20px;
    	display: inline-block;
    }
    
    figure > figcaption {
    	text-align: center;
    	display: block; /* For IE8 */
    }
    em{font-style: italic;}
    .view{height:100%;position: relative !important;}
    /*.view:after { content: ''; height: 60px; display: block;} */
    ._135editor {border:0 none;padding: 0px;z-index:0;position: relative !important;}
    ._135editor.active,.active{
        z-index: 100;
        outline: 1.5px dashed red !important;
        outline-offset: 2px;
    }
    ._135editor .overActive{
        z-index: 100;
        outline: 1.5px dashed #6085ef !important;
        outline-offset: 2px;
    }
    ._135editor .styleActive{
    	z-index: 100;
        outline: 1.5px dashed #6085ef !important;
        outline-offset: 2px;
    }
    .mark-changed {
        z-index: 101;
        outline: 2px dashed darkturquoise !important;
        outline-offset: 2px;
    }
    /*._135editor.active:before{content: "";z-index: -1;display: block;position: absolute;box-sizing:border-box;width: 102%;left:-1%;height: 100%;border:1px dashed red;}
    .view .active-135item:before {position: absolute;content: ''; left: 0;right: 0;top: 0;bottom: 0; box-sizing: border-box;border: 2px dashed red;margin:-5px;z-index: 1000;}*/
    ._135editor .draghandle{position: absolute;background-color:rgba(200,200,200,0.8);color:#333;cursor: move;top:-30px;right:-5px;padding: 3px 5px;font-size:12px;}
    .view .active-135item{position: relative !important;}
    
    h1,h2,h3,h4,h5,h6{font-weight:400;font-size:16px}
    .hidden{display: none;visibility: hidden;}
    .otf-poptools{ line-height: 24px; padding: 8px;
        border-radius: 0;border: 0 none;color: #FFF;position:absolute;width: 80%;left:15px;background:rgb(103,91,84);}
    .otf-poptools span {
        cursor: pointer;
        margin: 0 5px;
    }
    .slider{height:16px!important;width:auto;position:relative;background-color:#FFF;margin-bottom:5px}
    .slider .complete{height:100%;width:auto;color:#333;font-size:10px;line-height:16px;text-align:center;background-color:#ccc;z-index:2}
    .slider .marker{height:16px;width:12px;cursor:pointer;position:absolute;top:0;left:0;background-color:#999;z-index:3}
    
    
    /** 微信音乐,微信音频的样式 **/
    .db {  display: block;}
    
    qqmusic{
    	min-height: 60px;
        width: 100%;
        background: #ccc;
        margin: 17px 1px 16px 0;
        display: block;
        opacity: 0.9;
        background-image: url('https://image.135editor.com/files/users/0/1/201611/Omfdq9uS_SNXj.png');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }
    mpvoice{
        min-height: 90px;
        width: 100%;
        background: #ccc;
        margin: 17px 1px 16px 0;
        display: block;
        opacity: 0.9;
        background-color:#FCFCFC;
        background-image: url('https://by.135editor.com/img/icons/mpvoice.png');
        background-size: auto;
        background-position: left center;
        background-repeat: no-repeat;
    }
    
    覆盖themes的images目录下的所有图片

    百度云链接:https://pan.baidu.com/s/1rriaUhgCeNhlgwfmzTTOJA
    提取码:5j19

    重写ueditor.config.js文件
    /**
     * ueditor完整配置项
     * 可以在这里配置整个编辑器的特性
     */
    /**************************提示********************************
     * 所有被注释的配置项均为UEditor默认值。
     * 修改默认配置请首先确保已经完全明确该参数的真实用途。
     * 主要有两种修改方案,一种是取消此处注释,然后修改成对应参数;另一种是在实例化编辑器时传入对应参数。
     * 当升级编辑器时,可直接使用旧版配置文件替换新版配置文件,不用担心旧版配置文件中因缺少新功能所需的参数而导致脚本报错。
     **************************提示********************************/
    
    (function () {
    
        /**
         * 编辑器资源文件根路径。它所表示的含义是:以编辑器实例化页面为当前路径,指向编辑器资源文件(即dialog等文件夹)的路径。
         * 鉴于很多同学在使用编辑器的时候出现的种种路径问题,此处强烈建议大家使用"相对于网站根目录的相对路径"进行配置。
         * "相对于网站根目录的相对路径"也就是以斜杠开头的形如"/myProject/ueditor/"这样的路径。
         * 如果站点中有多个不在同一层级的页面需要实例化编辑器,且引用了同一UEditor的时候,此处的URL可能不适用于每个页面的编辑器。
         * 因此,UEditor提供了针对不同页面的编辑器可单独配置的根路径,具体来说,在需要实例化编辑器的页面最顶部写上如下代码即可。当然,需要令此处的URL等于对应的配置。
         * window.UEDITOR_HOME_URL = "/xxxx/xxxx/";
         */
        var URL = window.UEDITOR_HOME_URL || getUEBasePath();
    
        /**
         * 配置项主体。注意,此处所有涉及到路径的配置别遗漏URL变量。
         */
        window.UEDITOR_CONFIG = {
    
            //为编辑器实例添加一个路径,这个不能被注释
            UEDITOR_HOME_URL: URL
    
            // 服务器统一请求接口路径
            , serverUrl: URL + "/upload/"
    
            //工具栏上的所有的功能按钮和下拉框,可以在new编辑器的实例时选择自己需要的重新定义
            , toolbars: [[
                'fullscreen', 'source', '|', 'undo', 'redo', '|',
                'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
                'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
                'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
                'directionalityltr', 'directionalityrtl', 'indent', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
                'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
                'simpleupload', 'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
                'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
                'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
                'print', 'preview', 'searchreplace', 'drafts', 'help'
            ]]
            //当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准
            //,labelMap:{
            //    'anchor':'', 'undo':''
            //}
    
            //语言配置项,默认是zh-cn。有需要的话也可以使用如下这样的方式来自动多语言切换,当然,前提条件是lang文件夹下存在对应的语言文件:
            //lang值也可以通过自动获取 (navigator.language||navigator.browserLanguage ||navigator.userLanguage).toLowerCase()
            //,lang:"zh-cn"
            //,langPath:URL +"lang/"
    
            //主题配置项,默认是default。有需要的话也可以使用如下这样的方式来自动多主题切换,当然,前提条件是themes文件夹下存在对应的主题文件:
            //现有如下皮肤:default
            //,theme:'default'
            //,themePath:URL +"themes/"
    
            ,zIndex : 1     //编辑器层级的基数,默认是900
    
            // 针对getAllHtml方法,会在对应的head标签中增加该编码设置。
            ,charset:"utf-8"
    
            //若实例化编辑器的页面手动修改的domain,此处需要设置为true
            //,customDomain:false
    
            //常用配置项目
            //,isShow : true    //默认显示编辑器
    
            ,textarea:'content' // 提交表单时,服务器获取编辑器提交内容的所用的参数,多实例时可以给容器name属性,会将name给定的值最为每个实例的键值,不用每次实例化的时候都设置这个值
    
            //,initialContent:'欢迎使用ueditor!'    //初始化编辑器的内容,也可以通过textarea/script给值,看官网例子
    
            //,autoClearinitialContent:true //是否自动清除编辑器初始内容,注意:如果focus属性设置为true,这个也为真,那么编辑器一上来就会触发导致初始化的内容看不到了
    
            //,focus:false //初始化时,是否让编辑器获得焦点true或false
    
            //如果自定义,最好给p标签如下的行高,要不输入中文时,会有跳动感
            //,initialStyle:'p{line-height:1em}'//编辑器层级的基数,可以用来改变字体等
    
            ,iframeCssUrl: URL + '/themes/iframe.css' //给编辑区域的iframe引入一个css文件
    
            //indentValue
            //首行缩进距离,默认是2em
            //,indentValue:'2em'
    
            // ,initialFrameWidth:1000  //初始化编辑器宽度,默认1000
            // ,initialFrameHeight:800  //初始化编辑器高度,默认320
    
            ,readonly : false //编辑器初始化结束后,编辑区域是否是只读的,默认是false
    
            //,autoClearEmptyNode : true //getContent时,是否删除空的inlineElement节点(包括嵌套的情况)
    
            //启用自动保存
            //,enableAutoSave: true
            //自动保存间隔时间, 单位ms
            ,saveInterval: 60000
    
            //,fullscreen : false //是否开启初始化时即全屏,默认关闭
    
            ,imagePopup:true      //图片操作的浮层开关,默认打开
    
            ,autoSyncData:true //自动同步编辑器要提交的数据
            //,emotionLocalization:false //是否开启表情本地化,默认关闭。若要开启请确保emotion文件夹下包含官网提供的images表情文件夹
    
            //粘贴只保留标签,去除标签所有属性
            //,retainOnlyLabelPasted: false
    
            //,pasteplain:false  //是否默认为纯文本粘贴。false为不使用纯文本粘贴,true为使用纯文本粘贴
            //纯文本粘贴模式下的过滤规则
            //'filterTxtRules' : function(){
            //    function transP(node){
            //        node.tagName = 'p';
            //        node.setStyle();
            //    }
            //    return {
            //        //直接删除及其字节点内容
            //        '-' : 'script style object iframe embed input select',
            //        'p': {$:{}},
            //        'br':{$:{}},
            //        'div':{'$':{}},
            //        'li':{'$':{}},
            //        'caption':transP,
            //        'th':transP,
            //        'tr':transP,
            //        'h1':transP,'h2':transP,'h3':transP,'h4':transP,'h5':transP,'h6':transP,
            //        'td':function(node){
            //            //没有内容的td直接删掉
            //            var txt = !!node.innerText();
            //            if(txt){
            //                node.parentNode.insertAfter(UE.uNode.createText(' &nbsp; &nbsp;'),node);
            //            }
            //            node.parentNode.removeChild(node,node.innerText())
            //        }
            //    }
            //}()
    
            //,allHtmlEnabled:false //提交到后台的数据是否包含整个html字符串
    
            //insertorderedlist
            //有序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准
            ,'insertorderedlist':{
                 //自定的样式
                 //   'num':'1,2,3...',
                 //   'num1':'1),2),3)...',
                 //   'num2':'(1),(2),(3)...',
                 //   'cn':'一,二,三....',
                 //   'cn1':'一),二),三)....',
                 //   'cn2':'(一),(二),(三)....',
                //系统自带
                'decimal' : '' ,         //'1,2,3...'
                 'lower-alpha' : '' ,    // 'a,b,c...'
                 'lower-roman' : '' ,    //'i,ii,iii...'
                 'upper-alpha' : '' , //lang   //'A,B,C'
                 'upper-roman' : '' ,     //'I,II,III...'
                 'cjk-ideographic' : '一、二、三、',
                 'lower-greek':'α,β,γ,δ'
            }
    
            //insertunorderedlist
            //无序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准
            ,insertunorderedlist : {
            	//自定的样式
                //'dash' :'— 破折号', //-破折号
                //'dot':' 。 小圆圈',
            	//系统自带
                'circle' : '',  // '○ 小圆圈'
                'disc' : '',    // '● 小圆点'
                'square' : ''   //'■ 小方块'
            }
            ,listDefaultPaddingLeft : '30'//默认的左边缩进的基数倍
            //,listiconpath : 'http://bs.baidu.com/listicon/'//自定义标号的路径
            ,maxListLevel : -1 //限制可以tab的级数, 设置-1为不限制
    
            ,autoTransWordToList:true  //禁止word中粘贴进来的列表自动变成列表标签
    
            //fontfamily
            //字体设置 label留空支持多语言自动切换,若配置,则以配置值为准
            ,'fontfamily':[
                { label:'',name:'yahei',val:'微软雅黑'}, // 微软雅黑,Microsoft YaHei
                { label:'',name:'songti',val:'宋体,SimSun'},
                { label:'',name:'kaiti',val:'楷体,楷体_GB2312,SimKai'},
                { label:'',name:'heiti',val:'黑体,SimHei'},
                { label:'',name:'lishu',val:'隶书,SimLi'},
              //{ label:'文泉驿等宽正黑',name:'',val:'文泉驿等宽正黑'},
                //{ label:'文泉驿等宽微米黑',name:'',val:'文泉驿等宽微米黑'},
                { label:'站酷高端黑',name:'',val:'站酷高端黑'},
                { label:'站酷快乐体',name:'', val:'HappyZcool'},
                { label:'仿宋',name:'',val:'仿宋'},
                //{ label:'思源粗体',name:'',val:'Source Han Sans K Heavy'},
                //{ label:'思源极细',name:'',val:'Source Han Sans K ExtraLight'},
                { label:'',name:'arial',val:'arial,helvetica,sans-serif'}
            ]
            //fontsize
            //字号
    		,'fontsize':[10,11,12,13,14,15,16,17,18,19,20,24,28,32,36]
            ,'letterspacing':[0,0.25,0.5,1,1.5,2,2.5,3,4,5]
    		//lineheight
            //行内间距 值和显示的名字相同
            ,'lineheight':['1', '1.5','1.75','2','2.5', '3', '4', '5']
    
            //paragraph
            //段落格式 值留空时支持多语言自动识别,若配置,则以配置值为准
            //,'paragraph':{'p':'', 'h1':'', 'h2':'', 'h3':'', 'h4':'', 'h5':'', 'h6':''}
    
            //rowspacingtop
            //段间距 值和显示的名字相同
            //,'rowspacingtop':['5', '10', '15', '20', '25']
    
            //rowspacingBottom
            //段间距 值和显示的名字相同
            //,'rowspacingbottom':['5', '10', '15', '20', '25']
    
            //customstyle
            //自定义样式,不支持国际化,此处配置值即可最后显示值
            //block的元素是依据设置段落的逻辑设置的,inline的元素依据BIU的逻辑设置
            //尽量使用一些常用的标签
            //参数说明
            //tag 使用的标签名字
            //label 显示的名字也是用来标识不同类型的标识符,注意这个值每个要不同,
            //style 添加的样式
            //每一个对象就是一个自定义的样式
            //,'customstyle':[
            //    {tag:'h1', name:'tc', label:'', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:center;margin:0 0 20px 0;'},
            //    {tag:'h1', name:'tl',label:'', style:'border-bottom:#ccc 2px solid;padding:0 4px 0 0;margin:0 0 10px 0;'},
            //    {tag:'span',name:'im', label:'', style:'font-style:italic;font-weight:bold'},
            //    {tag:'span',name:'hi', label:'', style:'font-style:italic;font-weight:bold;color:rgb(51, 153, 204)'}
            //]
    
            //打开右键菜单功能
            ,enableContextMenu: true
            //右键菜单的内容,可以参考plugins/contextmenu.js里边的默认菜单的例子,label留空支持国际化,否则以此配置为准
            //,contextMenu:[
            //    {
            //        label:'',       //显示的名称
            //        cmdName:'selectall',//执行的command命令,当点击这个右键菜单时
            //        //exec可选,有了exec就会在点击时执行这个function,优先级高于cmdName
            //        exec:function () {
            //            //this是当前编辑器的实例
            //            //this.ui._dialogs['inserttableDialog'].open();
            //        }
            //    }
            //]
    
            //快捷菜单
    		,shortcutMenu:["fontfamily","fontsize","|",
            "bold","italic","underline",'fontborder','strikethrough',"forecolor","shadowcolor","insertorderedlist","insertunorderedlist","superscript", "subscript",
            "|","justifyleft","justifycenter","justifyright",'justifyjustify',"indent","rowspacingtop",'rowspacingbottom',"lineheight",'letterspacing']
    
            ,newShortcutMenu:["fontfamily","fontsize","justifyleft","justifycenter","justifyright",'justifyjustify',"indent","outpadding",'letterspacing','<br>', "rowspacingtop",'rowspacingbottom',"lineheight",
            "insertorderedlist","insertunorderedlist","bold","italic","underline",'fontborder','strikethrough','<br>',"forecolor","shadowcolor","backcolor","superscript", "subscript",'link','unlink']
            //elementPathEnabled
            //是否启用元素路径,默认是显示
            ,elementPathEnabled : false
    
            //wordCount
            ,wordCount:true          //是否开启字数统计
            //,maximumWords:10000       //允许的最大字符数
            //字数统计提示,{#count}代表当前字数,{#leave}代表还可以输入多少字符数,留空支持多语言自动切换,否则按此配置显示
            ,wordCountMsg:'当前已输入 {#count} 个字符,您还可以输入{#leave} 个字符'   //当前已输入 {#count} 个字符,您还可以输入{#leave} 个字符
            //超出字数限制提示  留空支持多语言自动切换,否则按此配置显示
            //,wordOverFlowMsg:''    //<span style="color:red;">你输入的字符个数已经超出最大允许值,服务器可能会拒绝保存!</span>
    
            //tab
            //点击tab键时移动的距离,tabSize倍数,tabNode什么字符做为单位
            //,tabSize:4
            //,tabNode:'&nbsp;'
    
            //removeFormat
            //清除格式时可以删除的标签和属性
            //removeForamtTags标签
            ,removeFormatTags:'a,b,big,code,del,dfn,em,font,i,section,blockquote,pre,fieldset,ins,kbd,q,samp,small,span,label,strike,strong,sub,sup,tt,u,var'
            //removeFormatAttributes属性
            ,removeFormatAttributes:'class,style,lang,width,accuse,height,align,hspace,valign,data-width,data-brushtype,opacity,border,title,placeholder'
    
            //undo
            //可以最多回退的次数,默认20
            ,maxUndoCount:20
            //当输入的字符数超过该值时,保存一次现场
            //,maxInputCount:1
    
            //autoHeightEnabled
            // 是否自动长高,默认true
            ,autoHeightEnabled:false
    
            //scaleEnabled
            //是否可以拉伸长高,默认true(当开启时,自动长高失效)
            ,scaleEnabled:false
    		,imageScaleEnabled:true
            //,minFrameWidth:800    //编辑器拖动时最小宽度,默认800
            //,minFrameHeight:220  //编辑器拖动时最小高度,默认220
    
            //autoFloatEnabled
            //是否保持toolbar的位置不动,默认true
            ,autoFloatEnabled:false
            //浮动时工具栏距离浏览器顶部的高度,用于某些具有固定头部的页面
            //,topOffset:30
            //编辑器底部距离工具栏高度(如果参数大于等于编辑器高度,则设置无效)
            //,toolbarTopOffset:400
    		,'remoteName':'#remoteName','remoteSummary':'#remoteSummary','remoteCoverimg':'#remoteCoverimg'
            //设置远程图片是否抓取到本地保存
            ,catchRemoteImageEnable: true //设置是否抓取远程图片
    
            //pageBreakTag
            //分页标识符,默认是_ueditor_page_break_tag_
            //,pageBreakTag:'_ueditor_page_break_tag_'
    
            // autotypeset
            // 自动排版参数
            ,autotypeset: {
                mergeEmptyline: true,           //合并空行
                removeClass: false,              //去掉冗余的class
                removeEmptyline: false,         //去掉空行
                textAlign:false,
                //textAlign:"left",               //段落的排版方式,可以是 left,right,center,justify 去掉这个属性表示不执行排版
                imageBlockLine: false,       //图片的浮动方式,独占一行剧中,左右浮动,默认: center,left,right,none 去掉这个属性表示不执行排版
                pasteFilter: false,             //根据规则过滤没事粘贴进来的内容
                clearFontSize: false,           //去掉所有的内嵌字号,使用编辑器默认的字号
                clearFontFamily: false,         //去掉所有的内嵌字体,使用编辑器默认的字体
                removeEmptyNode: false,         // 去掉空节点
                //可以去掉的标签
                //removeTagNames: {标签名字:1},
                indent: false,                  // 行首缩进
                indentValue : '2em',            //行首缩进的大小
                bdc2sb: false,
                tobdc: false
            }
    
            //tableDragable
            //表格是否可以拖拽
            //,tableDragable: true
    
    
    
            //sourceEditor
            //源码的查看方式,codemirror 是代码高亮,textarea是文本框,默认是codemirror
            //注意默认codemirror只能在ie8+和非ie中使用
            ,sourceEditor:"codemirror"
            //如果sourceEditor是codemirror,还用配置一下两个参数
            //codeMirrorJsUrl js加载的路径,默认是 URL + "third-party/codemirror/codemirror.js"
            //,codeMirrorJsUrl:URL + "third-party/codemirror/codemirror.js"
            //codeMirrorCssUrl css加载的路径,默认是 URL + "third-party/codemirror/codemirror.css"
            //,codeMirrorCssUrl:URL + "third-party/codemirror/codemirror.css"
            //编辑器初始化完成后是否进入源码模式,默认为否。
            //,sourceEditorFirst:false
    
            //iframeUrlMap
            //dialog内容的路径 ~会被替换成URL,垓属性一旦打开,将覆盖所有的dialog的默认路径
            //,iframeUrlMap:{
            //    'anchor':'~/dialogs/anchor/anchor.html',
            //}
    
            //allowLinkProtocol 允许的链接地址,有这些前缀的链接地址不会自动添加http
            //, allowLinkProtocols: ['http:', 'https:', '#', '/', 'ftp:', 'mailto:', 'tel:', 'git:', 'svn:']
    
            //webAppKey 百度应用的APIkey,每个站长必须首先去百度官网注册一个key后方能正常使用app功能,注册介绍,http://app.baidu.com/static/cms/getapikey.html
            //, webAppKey: ""
    
            //默认过滤规则相关配置项目
            ,disabledTableInTable:false  //禁止表格嵌套
            //,allowDivTransToP:true      //允许进入编辑器的div标签自动变成p标签
            ,rgb2Hex:true               //默认产出的数据中的color自动从rgb格式变成16进制格式
    
    		// xss 过滤是否开启,inserthtml等操作
    		,xssFilterRules: true
    		//input xss过滤
    		,inputXssFilter: true
    		//output xss过滤
    		,outputXssFilter: true
    		// xss过滤白名单 名单来源: https://raw.githubusercontent.com/leizongmin/js-xss/master/lib/default.js
    		// ,whitList: {
    		// 	a:      ['target', 'href', 'title', 'class', 'style'],
    		// 	abbr:   ['title', 'class', 'style'],
    		// 	address: ['class', 'style'],
    		// 	area:   ['shape', 'coords', 'href', 'alt'],
    		// 	article: [],
    		// 	aside:  [],
    		// 	audio:  ['autoplay', 'controls', 'loop', 'preload', 'src', 'class', 'style'],
    		// 	b:      ['class', 'style'],
    		// 	bdi:    ['dir'],
    		// 	bdo:    ['dir'],
    		// 	big:    [],
    		// 	blockquote: ['cite', 'class', 'style'],
    		// 	br:     [],
    		// 	caption: ['class', 'style'],
    		// 	center: [],
    		// 	cite:   [],
    		// 	code:   ['class', 'style'],
    		// 	col:    ['align', 'valign', 'span', 'width', 'class', 'style'],
    		// 	colgroup: ['align', 'valign', 'span', 'width', 'class', 'style'],
    		// 	dd:     ['class', 'style'],
    		// 	del:    ['datetime'],
    		// 	details: ['open'],
    		// 	div:    ['class', 'style'],
    		// 	dl:     ['class', 'style'],
    		// 	dt:     ['class', 'style'],
    		// 	em:     ['class', 'style'],
    		// 	font:   ['color', 'size', 'face'],
    		// 	footer: [],
    		// 	h1:     ['class', 'style'],
    		// 	h2:     ['class', 'style'],
    		// 	h3:     ['class', 'style'],
    		// 	h4:     ['class', 'style'],
    		// 	h5:     ['class', 'style'],
    		// 	h6:     ['class', 'style'],
    		// 	header: [],
    		// 	hr:     [],
    		// 	i:      ['class', 'style'],
    		// 	img:    ['src', 'alt', 'title', 'width', 'height', 'id', '_src', 'loadingclass', 'class', 'data-latex'],
    		// 	ins:    ['datetime'],
    		// 	li:     ['class', 'style'],
    		// 	mark:   [],
    		// 	nav:    [],
    		// 	ol:     ['class', 'style'],
    		// 	p:      ['class', 'style'],
    		// 	pre:    ['class', 'style'],
    		// 	s:      [],
    		// 	section:[],
    		// 	small:  [],
    		// 	span:   ['class', 'style'],
    		// 	sub:    ['class', 'style'],
    		// 	sup:    ['class', 'style'],
    		// 	strong: ['class', 'style'],
    		// 	table:  ['width', 'border', 'align', 'valign', 'class', 'style'],
    		// 	tbody:  ['align', 'valign', 'class', 'style'],
    		// 	td:     ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
    		// 	tfoot:  ['align', 'valign', 'class', 'style'],
    		// 	th:     ['width', 'rowspan', 'colspan', 'align', 'valign', 'class', 'style'],
    		// 	thead:  ['align', 'valign', 'class', 'style'],
    		// 	tr:     ['rowspan', 'align', 'valign', 'class', 'style'],
    		// 	tt:     [],
    		// 	u:      [],
    		// 	ul:     ['class', 'style'],
    		// 	video:  ['autoplay', 'controls', 'loop', 'preload', 'src', 'height', 'width', 'class', 'style']
    		// }
        };
    
        function getUEBasePath(docUrl, confUrl) {
            return getBasePath(docUrl || self.document.URL || self.location.href, confUrl || getConfigFilePath());
    
        }
    
        function getConfigFilePath() {
    
            var configPath = document.getElementsByTagName('script');
    
            return configPath[ configPath.length - 1 ].src;
    
        }
    
        function getBasePath(docUrl, confUrl) {
    
            var basePath = confUrl;
    
    
            if (/^(\/|\\\\)/.test(confUrl)) {
    
                basePath = /^.+?\w(\/|\\\\)/.exec(docUrl)[0] + confUrl.replace(/^(\/|\\\\)/, '');
    
            } else if (!/^[a-z]+:/i.test(confUrl)) {
    
                docUrl = docUrl.split("#")[0].split("?")[0].replace(/[^\\\/]+$/, '');
    
                basePath = docUrl + "" + confUrl;
    
            }
    
            return optimizationPath(basePath);
    
        }
    
        function optimizationPath(path) {
    
            var protocol = /^[a-z]+:\/\//.exec(path)[ 0 ],
                tmp = null,
                res = [];
    
            path = path.replace(protocol, "").split("?")[0].split("#")[0];
    
            path = path.replace(/\\/g, '/').split(/\//);
    
            path[ path.length - 1 ] = "";
    
            while (path.length) {
    
                if (( tmp = path.shift() ) === "..") {
                    res.pop();
                } else if (tmp !== ".") {
                    res.push(tmp);
                }
    
            }
    
            return protocol + res.join("/");
    
        }
    
        window.UE = {
            getUEBasePath: getUEBasePath
        };
    
    })();
    
    
    修改index.html文件

    修改index.html文件body标签中的内容即可

    <script id="editor" type="text/plain"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='ueditor/plugins/135editor.js') }}"></script>
    <script type="text/javascript">
                //实例化编辑器
                //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
                current_editor = UE.getEditor('editor',{
                    serverUrl:'/upload/',
                    initialFrameHeight:400,
                    focus:true,
                    toolbars:[
                    ['bold','italic', 'underline', 'fontborder', 'strikethrough',  '135editor','rowspacingtop', 'rowspacingbottom', 'lineheight','removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|','superscript', 'subscript' ]],
                    focusInEnd:true
                });
    
    查看效果

    最后就是检验效果的时候到了,先看看135编辑器给的demo案例中的编辑器吧

    135编辑器demo
    135编辑器demo笔者完成的demo:
    笔者完成的demo不仅仅是表面一样,连内容也是一样,给你们看看135编辑器的内容效果。

    内容效果:
    内容效果
    如果在实现135编辑器的时候出现任何情况都可以联系笔者,笔者尽可能为大家解决烦恼,以上内容部分是参照http://flask123.sinaapp.com/article/47/文章所写。

    QQ联系方式:1670044143

    展开全文
  • 一款好的代码编辑器可以使工作更有效率,但是从众多代码编辑器中挑选适合的自己的也是比较麻烦的一件事,今天小编就推荐几款Mac OS系统下适合新手使用的For mac简易代码编辑器,需要的来一起了解吧! 1、Visual ...
  • 20个最强的基于浏览器的在线代码编辑器 1. Compilr Compilr是一个在线编译器和在线IDE。可以用它来开发PHP, C, C++, Ruby。浏览器编译Java, C# 和 VB.net等。 马上使用 2. Dabblet 跨浏览器兼容,对前端...
  • 编辑器不自动被内容撑高 autoHeightEnabled: false, // 初始容器高度 initialFrameHeight: 500, // 初始容器宽度 initialFrameWidth: '100%', // 上传文件接口(这个地址是我为了方便各位体验文件上传功能搭建的临时...
  • clover 用ctrl+D可以对目录加收藏夹以便快速访问,win10自带的资源管理器也有添加快速访问,q-dir也有 摘自知乎https://zhuanlan.zhihu.com/p/41771626 1 资源管理器标签 ▍固定常用文件夹 把经常访问打开的...
  • 编译器与编辑器以及IDE的区别【前方高能】

    万次阅读 多人点赞 2019-06-30 10:54:39
    一、编译器 ...一个现代编译器的主要工作流程:源代码 (source code) → 预处理器 (preprocessor) → 编译器 (compiler) → 目标代码 (object code) → 链接 (Linker) → 可执行程序 (execut...
  • ① 主流的脚手架都支持,比如在线create-react-app,vue-cli等(在线 fork 修改),支持 github 登录(项目导入),也支持 cli 上传例子,例子可以在线访问和下载,当然也支持内嵌到其他博客等网页中。 ② 地址:codesandbox....
  • 如何向网页中插入视频

    万次阅读 2018-03-24 12:03:14
    [html] view plain copy这里介绍两种方式页面插入视频,一种是以前常用的flash方式,一种是近几年流行起来的html5方式。 到底选择哪种方式就看你具体的项目:flash:兼容性比较好,视频会压缩,相比其他...
  • 代码管理编辑工具Source Insight 4.0使用介绍

    万次阅读 多人点赞 2019-07-01 16:59:45
    2、在资源管理器中显示当前文档,即打开当前文档位置。 命令名:explorer 执行命令:explorer /select,%f 备注:知道,再说吧。 四、宏的使用 宏语言是SourceInsight定义的一种可编程语言。安装好一个Source...
  • 人力资源管理信息系统

    千次阅读 2017-01-25 15:04:47
    关注官网何朱必博客互动交流人力资源管理信息系统一、系统概述随着企业不断扩张,人力资源工作日趋复杂纷繁,部门众多、员工来源复杂、用工形式多元化。人力资源管理工作涉及到工资计算、人事信息的查询与管理、劳动...
  • Tomcat实现系统和Web管理的配置

    千次阅读 2016-11-05 14:27:32
    Tomcat实现系统和Web管理的配置
  • 有些网页的内容为什么不能复制

    千次阅读 2018-05-14 10:22:19
    有些网页的内容为什么不能复制?怎么才能将可以复制的内容复制下来呢?估计很多时候你会遇到很多的优美的比较实用的文章,你很想将其复制下来然后为己所用,但是可恨的是不知网页到底加了些什么东西搞得你复制...
  • 最新主流 Markdown 编辑器推荐

    万次阅读 多人点赞 2018-08-30 22:58:41
    Markdown ,2004年由 John Gruberis 设计和开发,是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式,以下将介绍目前比较流行的一些 Markdown 编辑器(排名分...
  • } 编辑器整体设计 一个组件选择区,提供使用者选择需要的组件 一个编辑预览画板,提供使用者拖拽排序页面预览的功能 一个组件属性编辑,提供给使用者编辑组件内部props、公共样式和动画的功能如图: 用户左侧组件...
  • CocosCreator编辑器界面

    千次阅读 2018-08-07 16:14:00
    资源管理器里显示了项目资源文件夹(assets)的所有资源。这里会以树状结构显示文件夹并自动同步操作系统对项目资源文件夹内容的修改。您可以将文件从项目外面直接拖拽进来,或使用菜单导入资源。 注:只有...
  • 如何制作网页

    千次阅读 2021-03-11 13:48:57
    如何制作网页?如何做一个自己喜欢的网站呢?看到别人有自己的网站是不是有点羡慕呢?当然。比较复杂的网站就需要很多技术上面的知识咯。比如javascrpt、jquery、ajax、flash等等!这些都只是让网站的页面好看。使静态的...
  • 折腾win7:保护眼睛,修改资源管理器背景颜色 xp适用 对于我这种每天对着电脑超过10个小时的人而言,操作系统默认的白色的背景实在有点太刺眼了,于是照着网上的一个方法,将系统默认的白色改为单单的绿色,win7系统...
  • 分享一篇文章,原文链接:Python IDEs and Code Editors (Guide)。 使用IDLE或者Python Shell来编写Python是非常适合于...使用一款集成开发环境甚至是一款好的专用的代码编辑器会让编程充满乐趣,但是如何选择呢?...
  • 一篇弄懂webpack静态资源打包

    千次阅读 热门讨论 2020-10-01 16:48:38
    开始打包第一个文件称为入口文件,通常经过入口文件引入其他资源,形成资源关系树状图。webpack根据依赖关系进行一次处理。 chunk代码块: 管理webpack内部的打包进程,chunk可以分为“入口”和“子代码块”,...
  • 电脑上qq,不能上网,打网页---问题分析

    万次阅读 热门讨论 2016-11-21 10:48:44
    昨天知道自己的电脑“犯了什么错”,上qq但是不能上网,打网页,找到自己想用的资料,这就忍了,更着急的是博客还没有写完,想想都觉得“恐怖”,还很影响心情,就各种杀毒,各种配置也没管用。...
  • Build 2015 大会上,微软除了发布了 Microsoft Edge 浏览器和新的 Windows 10 预览版外,最大的惊喜莫过于宣布推出免费跨平台的 Visual Studio Code 编辑器了!  Visual Studio Code (简称 VS Code / VSC) 是一...
  • 经常有朋友使用一些没有带文件管理器的空间时,苦于没有办法来解压上传的文件压缩包,而如果先上传压缩包,直接上传文件夹的话耗费的时间太多。还有一些朋友希望将空间变成一个文件存储站,这时就需要一个功能...
  • TWaver可视化编辑器(二)3D编辑器

    千次阅读 2017-08-11 16:17:38
    作为一款高效、轻量、自带编辑功能小组件,TWaver Java电信网管界一炮而红,各大运营商的OSS,BSS,NMS系统随处可见。
  • 能源的消耗是持续的,没有规划地任意使用是可取的,随着我国经济的发展和环境资源压力越来越大,节能减排形势严峻,中国,持续高速的经济增长的同时也引发了能源供应危机等问题。节能减排、低碳环保不再只是一...
  • python各种编辑器、APP、软件下载

    万次阅读 多人点赞 2020-11-24 08:37:00
    /python下载 / Windows推荐所有 Windows 10/8/7 用户安装 32 位版本部分扩展包可能支持 64 位 Python注意:Python 3.9 及以上版本...
  • ​尽管没有特别的动力去构建一个全新...在上篇文章《Repractise架构篇一: CMS的重构与演进》,我们说到编辑-发布-开发分离模式。系统架构如先前提到的,Carrot使用了下面的方案来搭建他们的静态内容的CMS。这个方案

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 76,640
精华内容 30,656
关键字:

在资源管理器中不能编辑网页