在线涂改图片 php,php UEditor如何实现删除图片功能

在线涂改图片 php,php UEditor如何实现删除图片功能phpueditor删除图片的实现方法:首先找到“uedior/dialogs/image/image.js”文件并修改Add内容;然后打开“mageManager.php”文件并添加内容为“functiondelfile()”即可。php版给UEditor的图片在线管理栏目增加图片删除功能1.找到uedior/dialogs/image/image.js文件,Add为修改部分的代码:/***…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

php ueditor删除图片的实现方法:首先找到“uedior/dialogs/image/image.js”文件并修改Add内容;然后打开“mageManager.php”文件并添加内容为“function delfile()”即可。

7cfec1a3cd57b67eaad8b475f0664d25.png

php版给UEditor的图片在线管理栏目增加图片删除功能

1.找到uedior/dialogs/image/image.js文件,Add为修改部分的代码:/**

* tab点击处理事件

* @param tabHeads

* @param tabBodys

* @param obj

*/

function clickHandler(tabHeads, tabBodys, obj) {

//head样式更改

for (var k = 0,

len = tabHeads.length; k < len; k++) {

tabHeads[k].className = “”;

}

obj.className = “focus”;

//body显隐

var tabSrc = obj.getAttribute(“tabSrc”);

for (var j = 0,

length = tabBodys.length; j < length; j++) {

var body = tabBodys[j],

id = body.getAttribute(“id”);

body.onclick = function() {

this.style.zoom = 1;

};

if (id != tabSrc) {

body.style.zIndex = 1;

} else {

body.style.zIndex = 200;

//当切换到本地图片上传时,隐藏遮罩用的iframe

if (id == “local”) {

toggleFlash(true);

maskIframe.style.display = “none”;

//处理确定按钮的状态

if (selectedImageCount) {

dialog.buttons[0].setDisabled(true);

}

} else {

toggleFlash(false);

maskIframe.style.display = “”;

dialog.buttons[0].setDisabled(false);

}

var list = g(“imageList”);

list.style.display = “none”;

//切换到图片管理时,ajax请求后台图片列表

if (id == “imgManager”) {

list.style.display = “”;

//已经初始化过时不再重复提交请求

if (!list.children.length) {

ajax.request(editor.options.imageManagerUrl, {

timeout: 100000,

action: “get”,

onsuccess: function(xhr) {

//去除空格

var tmp = utils.trim(xhr.responseText),

imageUrls = !tmp ? [] : tmp.split(“ue_separate_ue”),

length = imageUrls.length;

g(“imageList”).innerHTML = !length ? ” ” + lang.noUploadImage: “”;

for (var k = 0,ci; ci = imageUrls[k++];) {

//Add Start===============================

var div = document.createElement(“div”);

var img = document.createElement(“img”);

var del = document.createElement(“img”);

var p = document.createElement(“p”);

div.appendChild(img);

div.appendChild(p);

p.appendChild(del);

div.style.display = “none”;

img.style.height = “100px”;

img.style.width = “100px”;

del.setAttribute(“src”, “images/del.png”);

p.style.marginTop = “-104px”;

p.style.marginLeft = “90px”;

g(“imageList”).appendChild(div);

img.onclick = function() {

changeSelected(this);

};

del.onclick = function() {

var me = this,

src = me.getAttribute(“alt”, 2);

var pic = me.parentNode.parentNode.childNodes[0];

if (!confirm(“删除操作不可恢复,您确认要删除本图片么?”)) return;

ajax.request(editor.options.imageManagerUrl, {

action: “del”,

fileName: src.substr(src.lastIndexOf(“/”) + 1),

onsuccess: function(xhr) {

me.parentNode.parentNode.removeChild(pic);

me.parentNode.removeChild(me);

},

onerror: function(xhr) {

alert(“服务器删除图片失败,请重试!”);

}

});

};

//Add End================================

img.onload = function() {

this.parentNode.style.display = “”;

var w = this.width,

h = this.height;

scale(this, 100, 120, 80);

this.title = lang.toggleSelect + w + “X” + h;

this.onload = null;

};

img.setAttribute(k < 35 ? “src”: “lazy_src”, editor.options.imageManagerPath + ci.replace(/\s+|\s+/ig, “”));

img.setAttribute(“title”, editor.options.imageManagerPath + ci.replace(/\s+|\s+/ig, “”));

img.setAttribute(“width”, “100px”);

img.setAttribute(“height”, “100px”);

del.onload = function() { //设置加载del图片时的样式

this.style = “border:0”;

this.onload = null;

};

del.setAttribute(“alt”, editor.options.imageManagerPath + ci.replace(/\s+|\s+/ig, “”));

}

},

onerror: function() {

g(“imageList”).innerHTML = lang.imageLoadError;

}

});

}

}

if (id == “imgSearch”) {

selectTxt(g(“imgSearchTxt”));

}

if (id == “remote”) {

$focus(g(“url”));

}

}

}

}

找到uedior/php/imageManager.php文件,增加以下内容:if ($action == “del”) {

$fileName = $_POST[‘fileName’];

foreach($paths as $path) {

$str1 = delfiles($fileName, $path);

break;

}

}

function delfiles($fileName, $path, &$files = array()) {

if (!is_dir($path)) return null;

$handle = opendir($path);

while (false !== ($file = readdir($handle))) {

if ($file != ‘.’ && $file != ‘..’) {

$path2 = $path.’/’.$file;

if (is_dir($path2)) {

delfiles($fileName, $path2, $files);

} else {

if (preg_match(“/\.(gif|jpeg|jpg|png|bmp)$/i”, $file)) {

$path3 = str_replace(‘../../’, ‘/static/’, $path2);

$fileImg = basename($path3);

if ($fileImg == $fileName) {

$is_del = unlink($path2);

}

}

}

}

}

}

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/196384.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 如何安装win10和linux双系统。以及引导系统问题。

    如何安装win10和linux双系统。以及引导系统问题。1.安装环境介绍首先,出于本人学习需要,要用到linux系统,但是经常又会用到win10,因此迫切需要双系统的电脑。所在本人就琢磨着怎么在不删除原来win10的情况下可以装一个linux的ubuntu系统。2.常见的安装步骤 2.1首先在想要安装linux系统的磁盘的尾巴步压缩出一个大概50G的空间,超大预算,压缩出来的空间在这里不用建立成新分区,待后面备用。在这里,本人选的是非系统盘…

    2022年7月24日
    16
  • 怎么快速拿到跨境电商ERP源码?[通俗易懂]

    怎么快速拿到跨境电商ERP源码?[通俗易懂]回顾全球跨境电商行业发展历程可以发现,跨境电商是从传统外贸发展到外贸电商,在进一步发展成为跨境电商的,跨境电商发展至今,也不过二三十年的时间,借助于互联网技术的快速提升,跨境电商呈现出爆发式增长。我国跨境电商在二十年间从无到有、从弱到强,经历了从萌芽到成长、从扩张到成熟的四个阶段。当前,我国跨境电商产业正在加速外贸创新发展进程,已经成为我国外贸发展的新引擎。客乐乐ERP是一款专业的跨境店铺管理ERP软件,由顶级技术团队打造,致力于帮助跨境卖家增效降本、提高效率1.订单管理自动审单、标记发货

    2022年9月20日
    2
  • vue入门基础教程之经验总结篇(小白入门必备)|建议收藏「建议收藏」

    vue入门基础教程之经验总结篇(小白入门必备)|建议收藏「建议收藏」VUEvue组件的三个API:prop、event、slotprop定义了这个组件有哪些可配置的属性,组件的核心功能也都是它来确定的。组件里定义的prop都是单向数据流,只能通过父级组件对齐进行修改,组件本身不能修改props的值,只能修改定义在data里的数据,非要修改,也是通过后面介绍的自定义事件通知父级,由父级来修改;在子组件定义prop是,使用了camelCase的命名法,由于html特性不区分大小写。camelCase的prop用于特性时,会转为短横线隔开(比如availab

    2022年6月4日
    32
  • springboot简易入门教程[通俗易懂]

    springboot简易入门教程[通俗易懂]一.在idea中如何使用maven创建springboot工程1.首先打开idea,点击左上方file,在new里面寻找并点击module,如下图所示2.完成上一步后点next3.命名自己的模块

    2022年7月4日
    24
  • 记一次post请求参数太长导致的400报错

    记一次post请求参数太长导致的400报错背景:springboot2.1.1+vue2.6.11+iview3.3.0+axios0.18.1这个接口是接收前台图文编辑器的内容,插入数据库,当接收图文内容的字段过长时,就抛出400网上查了很多解决方案,都是从修改配置方面着手,试过如下:还有说debug源码的,参数格式错的……各种方法试过,大好青春浪费在试错上了。不说了,上答案:只修改了传参方式,结果如下:这里有一个关键,后台传参要用@RequestBody至于原因我就不说了,小伙伴可以自行搜索vueda

    2022年6月1日
    126
  • ubuntu设置

    ubuntu设置

    2021年4月26日
    154

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号