使用ajax上传器删除上传的图像

时间:2014-12-15 06:36:58

标签: php jquery ajax html5 jquery-file-upload

我使用ajax加载器将文件上传到服务器。它工作正常,但现在我想为每个图像设置删除选项,并可以在保存之前删除该图像。我当前的图像看起来像:

enter image description here

我正在使用此文件上传程序脚本进行文件上传。Link

我的文件上传代码是:

jQuery("#fileuploader").uploadFile({
    url:"<?php echo $this->getUrl('pmembers/priority/productimages/') ?>",
    multiple:true,
    fileName:"myfile",
    onSuccess: function (files, response, xhr,pd) { 
      var dir = '<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_MEDIA)."mkd/uploads/".Mage::getSingleton("customer/session")->getId()."/"; ?>';

        jQuery('#files').append('<li style="width:60px; float:left;margin-left:5px; margin-right:5px;"><img width="60" height="60" src="'+dir+files+'" /></li><img src="cross.png" />');


       },
    });
});

1 个答案:

答案 0 :(得分:0)

尝试: 单击删除按钮时的事件将向服务器发送请求取消链接(路径:&#34; dir + files&#34;),完成服务器后将向客户端返回通知。

jQuery的:

var removeButton = $("li > img:last");
removeButton.click(function(){
    if (removeButton.attr('handling') != "true") {
        removeButton.attr('handling', 'true');
        var path = removeButton.prev('img[src]').attr('src');
        $.ajax({
            type: "POST",
            dataType: "json",
            url: (url),
            data: {'path': path},
            error: function () {
                //. Action when error.
            },
            success: function (data) {
                //. Action when success.
            }
        }).done(function(){
            removeButton.attr('handling', 'false');
        });
    }
});

PHP:

$path = $_POST['path'];
$unlink = unlink($path);
if (!$unlink) {
    print json_encode(array("return" => false)); exit();
}else {
    print json_encode(array("return" => true)); exit();
}