Question

我正在使用jquery多个图片上传插件。在这里，我能够将图像插入数据库。我在每个图像预览旁边放了一个关闭图标。这是我的代码：

$(function () {
  var url = (window.location.hostname === 'blueimp.github.com' ||
                window.location.hostname === 'blueimp.github.io') ?
                '//jquery-file-upload.appspot.com/' : 'server/php/';

$('#fileupload').fileupload({
        url: url,
        dataType: 'json',
        autoUpload: true,

    }).on('fileuploadadd', function (e, data) {
        data.context = $('<div/>').appendTo('#files');
        $.each(data.files, function (index, file) {
            var node = $('<p/>').append('<span class="close_img"><img src="/Moumita/image_upload/img/close_img.png"/><span>');

            node.appendTo(data.context);
        });
    })
 });

在UploadHandler.php中，这些功能也存在：

function __construct($options = null, $initialize = true, $error_messages = null) {
        $this->options = array(


            'script_url' => $this->get_full_url().'/',
            'upload_dir' => dirname($this->get_server_var('SCRIPT_FILENAME')).'/files/',
            'upload_url' => $this->get_full_url().'/files/',
            'user_dirs' => false,
            'mkdir_mode' => 0755,
            'param_name' => 'files',
            // Set the following option to 'POST', if your server does not support
            // DELETE requests. This is a parameter sent to the client:
            'delete_type' => 'DELETE',
            'access_control_allow_origin' => '*',
            'access_control_allow_credentials' => false,
            'access_control_allow_methods' => array(
                'OPTIONS',
                'HEAD',
                'GET',
                'POST',
                'PUT',
                'PATCH',
                'DELETE'
            ),
            ..........................


            )
        );
        if ($options) {
            $this->options = array_merge($this->options, $options);
        }
        if ($error_messages) {
            $this->error_messages = array_merge($this->error_messages, $error_messages);
        }
        if ($initialize) {
            $this->initialize();
        }
    }

    protected function initialize() {
        switch ($this->get_server_var('REQUEST_METHOD')) {
            case 'OPTIONS':
            case 'HEAD':
                $this->head();
                break;
            case 'GET':
                $this->get();
                break;
            case 'PATCH':
            case 'PUT':
            case 'POST':
                $this->post();
                break;
            case 'DELETE':
                $this->delete();
                break;
            default:
                $this->header('HTTP/1.1 405 Method Not Allowed');
        }
    }



    protected function set_file_delete_properties($file) {
        $file->delete_url = $this->options['script_url']
            .$this->get_query_separator($this->options['script_url'])
            .'file='.rawurlencode($file->name);
        $file->delete_type = $this->options['delete_type'];
        if ($file->delete_type !== 'DELETE') {
            $file->delete_url .= '&_method=DELETE';
        }
        if ($this->options['access_control_allow_credentials']) {
            $file->delete_with_credentials = true;
        }
    }



    protected function handle_form_data($file, $index) {
        // Handle form data, e.g. $_REQUEST['description'][$index]
    }


    public function post($print_response = true) {
        if (isset($_REQUEST['_method']) && $_REQUEST['_method'] === 'DELETE') {
            return $this->delete($print_response);
        }
        ............

    }

    public function delete($print_response = true) {
        $file_name = $this->get_file_name_param();
        $file_path = $this->get_upload_path($file_name);
        $success = is_file($file_path) && $file_name[0] !== '.' && unlink($file_path);
        if ($success) {
           // $this->delete_img($file_name);
            foreach($this->options['image_versions'] as $version => $options) {
                if (!empty($version)) {
                    $file = $this->get_upload_path($file_name, $version);
                    if (is_file($file)) {
                        unlink($file);
                    }
                }
            }
        }
        return $this->generate_response(array('success' => $success), $print_response);
    }


    function delete_img($delimg)  
    {  
            $delete_from_db = $this->query("DELETE FROM `file_upload_multiple_images` WHERE `images` = '$delimg'") or die(mysql_error());  
            return $delete_from_db;  
    }

我无法调用此删除功能来删除数据库和文件夹中的图像。我想要一些东西来调用onclick关闭图标的功能。

Answer 1

您必须使用回叫功能才能使其正常工作。

回调函数是通过事件fileuploaddone处理从服务器接收的数据的函数。因此，您将拥有这样的代码：

$('#fileupload').bind('fileuploaddone', callbackfunc); 

// Your callback function
function callbackfunc(e, data) { 
    /* your code, like : if (data.kind === "error") alert(data.message); */ 
}

但你可以通过匿名函数缩短它：

$('#fileupload').bind('fileuploaddone', function (e, data) {
             /* your code, like : if (data.kind === "error") alert(data.message); */
 })

对于删除，回调可以与事件fileuploaddestroy绑定（参见本页：BlueImp options）。

让我知道我是否可以帮助你。

使用Jquery多个文件上传插件删除上传的图像时出现问题

1 个答案: