How to implement the function of deleting pictures in php UEditor

php ueditor implementation method of deleting images: First find the "uedior/dialogs/image/image.js" file and modify the Add content; then open the "mageManager.php" file and add the content as "function delfile() "That's it.

Recommended: "PHP Video Tutorial"

php version adds an online image management column to UEditor Image deletion function

1. Find the uedior/dialogs/image/image.js file, and Add the modified part of the code:

/**
 * 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"));
            }
        }
    }
}

Find uedior/php/imageManager.php file and add the following content:

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);
                    }
                }
            }
        }
    }
}

The above is the detailed content of How to implement the function of deleting pictures in php UEditor. For more information, please follow other related articles on the PHP Chinese website!