javascript - 如何删除提交按钮并保存图像以及在codeigniter中使用ajax显示图像？

Question

大家好，我想删除提交按钮并仅使用上传按钮上传我的图像。我还使用 ajax 将图像发送到数据库以及 eupload 文件夹中。当我删除提交按钮并在表单中使用 $(this).submit() 时，它什么也不显示，并且没有 ajax 运行。 我究竟做错了什么？ 这是我的代码

        {
            if(!$timeline_image=="")
            {
                $image_properties = array('src' => base_url("uploads/".$timeline_image),'width' => '900px','height'=> '400px','id'=>'coverimg', 'title' => 'That was quite a night','rel'   => 'lightbox');
                echo img($image_properties);
            }else{
                $timiline_image = array(
                    'src'   => base_url("assets/img/Facebook-cover.jpg"),
                    'width' => '900px',
                    'height'=> '400px',

                );

                echo img($timiline_image);
            }
            ?>
            <div id="timelineselector" class="col-md-3 grow">
                <?php echo form_open_multipart('',["id"=>"form_cover"]); ?>
                <input type="hidden" name="id" value="<?php echo $id ;?>">
                <?php echo form_upload(["name"=>"timelineimage","id"=>"timelineimage" ]); ?>
                <?php echo form_close(); ?>
            </div>
            <?php
        }
        ?>
    </div>
</div>

现在是ajax

    jQuery('#form_cover').submit(function(e) {
  e.preventDefault();
  var formData = new FormData(this);
  var url = '<?php echo base_url("user/coverimage"); ?>';
  formData.value
  jQuery.ajax({
    type: "POST",
    url: url,
    data: formData,
    cache: false,
    contentType: false,
    processData: false,
    success: function(data) {
      console.log(data);
      $('#coverimg').attr('src', data);
    },
    error: function(data) {
      //error function
    }
  });
});

Answer 1

jQuery .submit()是一个事件绑定(bind)器，它将您传递给它的函数与所需元素的提交事件绑定(bind)在一起。

为了根据需要执行操作，您必须将 submit 监听器替换为针对上传字段的 on change 监听器。由于删除提交按钮后，不会发生提交操作。

$('#timelineimage').change(function(e){
     // Logic
});