百度umeditor富⽂本编辑器⽀持从word复制粘贴保留格式和图
⽚的插件
如何做到 ueditor批量上传word图⽚？
1、前端引⽤代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>
<title>编辑器完整版实例-1.2.6.0</title>
<script type="text/javascript"src="fig.js"charset="utf-8"></script>
<script type="text/javascript"src="ueditor.all.js"charset="utf-8"></script>
<link type="text/css"rel="Stylesheet"href="WordPaster/css/WordPaster.css"/>
<link type="text/css"rel="Stylesheet"href="WordPaster/js/skygqbox.css"/>
<scrip ttype="text/javascript"src="WordPaster/js/json2.min.js"charset="utf-8"></script>
<scrip ttype="text/javascript"src="WordPaster/js/jquery-1.4.min.js"charset="utf-8"></script>
<scrip ttype="text/javascript"src="WordPaster/js/WordPaster.js"charset="utf-8"></script>
<scrip ttype="text/javascript"src="WordPaster/js/skygqbox.js"charset="utf-8"></script>
</head>
<body>
<textarea name="后台取值的key"id="myEditor">这⾥写你的初始化内容</textarea>
<script type="text/javascript">
var pasterMgr = new WordPasterManager();
pasterMgr.Config["PostUrl"] = "localhost:81/WordPaster2/WordPasterUEditor1x/php/upload.php"
pasterMgr.Load();//加载控件
pasterMgr.SetEditor(this);
}});
</script>
</body>
</html>
请求
⽂件上传的默认请求是⼀个⽂件，作为具有“upload”字段的表单数据。
当⽂件成功上传时的JSON响应：
uploaded- 设置为1。
fileName - 上传⽂件的名称。
url - 上传⽂件的URL。
响应：⽂件⽆法上传
uploaded- 设置为0。
2、粘贴word⾥⾯的图⽚路径是fill://D 这种格式 我理解这种是⾮浏览器安全的 许多浏览器也不⽀持
⽬前项⽬是⽤了⼀种变通的⽅式：
先把word上传到后台 、poi解析、存储图⽚ 、转换html、替换图⽚、放到富⽂本框⾥显⽰
（富⽂本显⽰有个坑：没到直接给富⽂本赋值的⽅法 要先销毁 记录下
success : function(data) {
$('#content').attr('value',data.imagePath);
var editor = CKEDITOR.instances["content"]; //你的编辑器的"name"属性的值
if (editor) {
editor.destroy(true);//销毁编辑器
}
$("#content").val(result);    //对editor赋值
//tCkeditor.setData($("#content").text());
}
3.接收上传的图⽚并保存在服务端
<?php
ob_start();
//201201/10
$timeDir =date("Ym")."/".date("d");
$uploadDir =dirname(__FILE__).'/upload/'.$timeDir;
$curDomain = "".$_SERVER["HTTP_HOST"]."/";
$relatPath = $curDomain ."WordPaster2/WordPasterUEditor1x/php/upload/" . $timeDir . "/"; //⾃动创建⽬录。upload/2012-1-10
if(!is_dir($uploadDir))
{
mkdir($uploadDir,0777,true);
//如果PHP页⾯为UTF-8编码，请使⽤urldecode解码⽂件名称
//$fileName = urldecode($_FILES['postedFile']['name']);
//如果PHP页⾯为GB2312编码，则可直接读取⽂件名称
$fileName = $_FILES['file']['name'];
$tmpName = $_FILES['file']['tmp_name'];
//取⽂件扩展名jpg,gif,bmp,png
$path_parts =pathinfo($fileName);
$ext = $path_parts["extension"];
$ext =strtolower($ext);//jpg,png,gif,bmp
//只允许上传图⽚类型的⽂件
if($ext == "jpg"
|| $ext == "jpeg"
|| $ext == "png"
|| $ext == "gif"
|| $ext == "bmp")
{
//年_⽉_⽇_时分秒毫秒.jpg
$saveFileName = $fileName;
//xxx/2011_05_05_091250000.jpg
$savePath = $uploadDir . "/" . $saveFileName;
//另存为新⽂件名称
if (!move_uploaded_file($tmpName,$savePath))
{
exit('upload error!' . "⽂件名称：" .$fileName . "保存路径：" . $savePath);    }
}
//输出图⽚路径
//$_SERVER['HTTP_HOST']  localhost:81
//$_SERVER['REQUEST_URI'] /FCKEditor2.4.6.1/php/test.php $reqPath =str_replace("upload.php","",$_SERVER['REQUEST_URI']); echo $relatPath .  $saveFileName;
header('Content-type: text/html; charset=utf-8');
header('Content-Length: ' .ob_get_length());
效果展⽰：
jquery在项目里是干啥的
在使⽤前需要配置⼀下，可以参考我写的这篇⽂章：讨论：223813913

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。