Question

我为我的框架使用codeigniter当我点击我的图片删除按钮时，它第一次正常工作。然而，当我在运行ajax脚本两次并导致它通过我的json错误之后直接删除另一个第二个图像时。

如果我删除了一个图像然后再删除另一个图像，我怎么能这样做呢？当我删除第二个图像时它不会多次运行？

似乎是$('#button-refresh').trigger('click');

的一些东西

$(document).on('click', '#button-delete', function(e) {
    if (confirm('Are You Sure!')) {

            e.preventDefault();

            $.ajax({
            url: "<?php echo base_url('admin/common/filemanager/delete');?>",
            type: 'post',       
            dataType: 'json',
            data: {
                cache: $(this).attr('data-cache'),
                image: $(this).attr('data-path')
            },
            success: function(json) {
                if (json['error']) {
                    alert(json['error']);
                }

                if (json['success']) {                                          
                    $('#button-refresh').trigger('click');
                }
            },      
        });
    }
});

模态

<div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
            <div class="btn-toolbar mb-3" role="toolbar" aria-label="Toolbar with button groups">

            <div class="btn-group mr-2" role="group" aria-label="First group">
            <a class="btn btn-dark" href="<?php echo $parent;?>" data-toggle="tooltip" data-placement="top" title="<?php echo $button_parent; ?>" id="button-parent" class="btn btn-default"><i class="fa fa-level-up"></i></a> 
            <button type="button" data-toggle="tooltip" data-placement="top" title="<?php echo $button_upload; ?>" id="button-upload" class="btn btn-primary"><i class="fa fa-upload"></i></button>

            <button type="button" data-toggle="tooltip" data-placement="top" title="<?php echo $button_folder; ?>" id="button-folder" class="btn btn-secondary"><i class="fa fa-folder"></i></button>

            <a id="button-refresh" href="<?php echo $refresh;?>" data-toggle="tooltip" data-placement="top" title="<?php echo $button_refresh; ?>" class="btn btn-success"><i class="fa fa fa-refresh" aria-hidden="true"></i></a>

            <button type="button" data-toggle="tooltip" data-placement="top"  title="<?php echo $button_delete; ?>" id="button-delete" class="btn btn-danger"><i class="fa fa-trash" aria-hidden="true"></i></button>
            </div>

            <div class="input-group">
            <span class="input-group-btn">
            <button class="btn btn-secondary" type="button"><i class="fa fa-search" aria-hidden="true"></i></button>
            </span>
            <input type="text" class="form-control" placeholder="Search for..." aria-label="Search for...">
            </div>

            </div>
        </div>

        <div class="modal-header justify-content-center">
        <ol class="breadcrumb">
        <?php foreach ($breadcrumbs as $breadcrumb) { ?>
        <li class="breadcrumb-item"><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a></li>
        <?php } ?>
        </ol>
        </div>

        <div class="modal-body">

        <?php $image_row = 0; ?>

        <?php foreach (array_chunk($images, 4) as $image) { ?>

        <div class="row">

            <?php foreach ($image as $image) { ?>
            <div class="col-sm-3 text-center">
            <?php if ($image['type'] == 'directory') { ?>

            <div class="text-center">
            <a href="<?php echo $image['href']; ?>" class="directory" style="vertical-align: middle;"><i class="fa fa-folder fa-5x"></i>
            </a>
            </div>

            <label>
            <input type="checkbox" name="path[]" value="<?php echo $image['path']; ?>" />
            <?php echo $image['name']; ?>
            </label>
            <?php } ?>

            <?php if ($image['type'] == 'image') { ?>

            <div >
            <a href="<?php echo $image['href']; ?>">
            <?php echo $image['thumb']; ?>
            </a>

            <div class="mb-4 mt-2">
            <button type="button" id="button-delete" data-cache="<?php echo $image['cache']; ?>" data-path="<?php echo $image['path']; ?>"><i class="fa fa-trash-o"></i></button>
            </div>
            </div>

            <?php } ?>

            </div><!-- Column -->

            <?php } ?>

        </div><!-- Row-->

            <?php $image_row++; ?>

        <?php } ?>


        </div><!-- Modal Body-->

    <div class="modal-footer  justify-content-center">
        <?php echo $pagination; ?>
    </div>
  </div>
</div>

控制器功能

public function delete() {
    $json = array();

    if (null !==($this->input->post('cache'))) {
        $cache_dir = $this->security->xss_clean(DIR_IMAGE . 'cache/' . $this->input->post('cache'));
    } else {
        $json['error'] = 'Could not locate file ' . $this->input->post('cache');
    }

    if (null !==($this->input->post('image'))) {
        $image_dir = $this->security->xss_clean(DIR_IMAGE . $this->input->post('image'));
    } else {
        $json['error'] = 'Could not locate file ' . $this->input->post('image');
    }

    if (!$json) {

        if (is_file($cache_dir)) {

            unlink($image_dir);

            unlink($cache_dir);

            $json['success'] = TRUE;

        } else {

            $json['error'] = 'Could not unlink file';
        }
    }

    $json = $this->security->xss_clean($json);
    $this->output->set_content_type('Content-Type: application/json');
    $this->output->set_output(json_encode($json));
}

Answer 1

我想我现在已经使用#viewport { background: #000; color: #000; top: 0; right: 10px; position: fixed; z-index: 100; }解决了这个问题。任何其他建议也会使用完全。

正如@Vickel在评论中所说，我现在使用$(this).off(e);

e.stopImmediatePropagation()

删除图像后直接删除已删除的图像不能正常工作

1 个答案: