龙空技术网

UMEDITOR如何能实现直接粘贴把图片上传到服务器中

荆门泽优软件有限公司 44

前言:

如今同学们对“上传图片至服务器”都比较注意,各位老铁们都需要了解一些“上传图片至服务器”的相关资讯。那么小编同时在网摘上网罗了一些有关“上传图片至服务器””的相关内容,希望朋友们能喜欢,你们快快来学习一下吧!

需求:粘贴word内容,粘贴word图片,粘贴word图文,用户发布新闻的时候是从word里面复制图片和文字,然后将word图文内容粘贴到web富文本编辑器中,希望能够将word的图片自动上传到服务器中,服务器地址能够自定义,后端的话需要支持任意开发语言,比如ASP,ASP.NET,JSP,PHP,PYTHON等。只要是基于标准HTTP协议的都要支持。如果能够不装控件最好,

UMEditor1.2.3整合教程

下载示例:

1.添加按钮样式

样式代码

.edui-icon-wordpaster {width: 16px;height: 16px;background: url(‘../../../../wordpaster/css/paster.png’) no-repeat !important;}

2.在工具栏中添加按钮

3.复制wordpaster目录到项目中

4.在页面中注册按钮

在页面中添加引用

<link href=“umeditor/themes/default/css/umeditor.min.css” type=“text/css” rel=“stylesheet”>

<script type=“text/javascript” src=“umeditor/third-party/jquery.min.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“umeditor/umeditor.config.js” ></script>

<script type=“text/javascript” src=“umeditor/umeditor.min.js” ></script>

<link type=“text/css” rel=“Stylesheet” href=“wordpaster/css/WordPaster.css”/>

<link type=“text/css” rel=“Stylesheet” href=“wordpaster/js/skygqbox.css” />

<script type=“text/javascript” src=“wordpaster/js/json2.min.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“wordpaster/js/w.edge.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“wordpaster/js/w.app.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“wordpaster/js/w.file.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“wordpaster/js/WordPaster.js” charset=“utf-8”></script>

<script type=“text/javascript” src=“wordpaster/js/skygqbox.js” charset=“utf-8”></script>

在JS中注册插件

代码

<script type=“text/javascript”>

var pasterMgr = new WordPasterManager();

pasterMgr.Config[“PostUrl”] = “”

pasterMgr.Config[“Cookie”] = ‘<%=clientCookie%>‘;

pasterMgr.Load();//加载控件

UM.registerUI(‘wordpaster’,

function(name) {

var me = this;

var $btn = $.eduibutton({

icon : name,

click : function(){

pasterMgr.Paste();

},

title: ‘粘贴Word图片’

});

this.addListener(‘ready’,function(){

pasterMgr.SetEditor(this);

});

return $btn;

}

);

UM.getEditor(‘editor’);

</script>

整合后的效果

标签: #上传图片至服务器