Question

使用addEventListner我正在尝试上传图片。当我第一次上传图像时工作正常。但第二次通过更改图像大小上传相同的图像时，其传递的php图像错误3（上传的文件仅部分上传）。

我的代码如下：

jQuery('document').ready(function(){
    var input = document.getElementById("upimg");

    var formdata = false;

    if (window.FormData) {
        formdata = new FormData();
    }

    if(input != null) {

        input.addEventListener("change", function (evt) {

        var i = 0, len = this.files.length, img, reader, file;
        for ( ; i < len; i++ ) {
            file = this.files[i];
            if (!!file.type.match(/image.*/)) {
                if (formdata) {
                    formdata.append("image", file);
                    formdata.append("appid",appid);
                    formdata.append("deviceid",$('#selected_device_id').val());
                    formdata.append("selected_device_id",$('#selected_device_id').val());
                    formdata.append("selected_parentid",$('#selected_parentid').val());
                    formdata.append("selected_propertyid",$('#selected_propertyid').val());
                    formdata.append("selected_propertyname",$('#selected_propertyname').val());
                    formdata.append("opacity",$('#opt1').val());
                    if($('#selected_parentid').val() == '12')
                    {formdata.append("ratio",'240x320');}
                    if($('#selected_parentid').val() == '15')
                    {formdata.append("ratio",'320x480');}
                    if($('#selected_parentid').val() == '18')
                    {formdata.append("ratio",'480x800');}
                    if($('#selected_parentid').val() == '31')
                    {formdata.append("ratio",'640x960');}
                }
                if (formdata) {

                    jQuery.ajax({
                        url: siteUrl+'design/imgupload',
                        type: "POST",
                        data: formdata,
                        processData: false,
                        contentType: false,
                        success: function (res) {
                          var result = res.search( 'success`' );
                          if(result == '-1')
                          {
                            jQuery('div#response').html('<span style="color:red;">'+res+'</span>');

                          }else{

                            var updatedimg = res.replace("success`", "");
                            var imagesrc = baseUrl+'apps/'+appid+'/'+$('#device_name').text()+'/'+updatedimg; 
                            if (document.getElementById('bg_img')) {
                                //$('#bg_img').attr('src', imagesrc);
                                $('#bg_img').attr('style', 'background-image:url("'+imagesrc+'")');
                             } else {
                                $("#maindialerdesignbg").append("<a href='#' id='bg_img_ank'><img id='bg_img' style='width:100%' src="+imagesrc+"></a>");
                              }
                            jQuery('div#response').html('');
                          }
                          file = '';
                        }
                    });
                }
            }
            else
            {
                alert('Not a vaild image!');
            }
        }
    }, false);
  }  
});

我的php作为foliows：

public function imgupload() {

        $error = '';

        $image_info = getimagesize($_FILES['image']['tmp_name']);

        if(count($image_info)>0)
        {
            $img_width = $image_info[0];
            $img_height = $image_info[1];
        }
        $device['deviceid'] =$this->input->post('deviceid');
        $device['parentid'] =  $this->input->post('selected_parentid');
        $parent=$this->Application_model->device_parentname($device);               
        $parent_name = $parent[0]['device_properties_name'];
        $parent_folder = preg_replace('/\s+/','',$parent_name);
        if(isset($_POST['icontype']))
        {
            $activeicons = 'activeicons';
            if(isset($_POST['activeicon']))
            { 
                $parent_folder .= '/'.preg_replace('/\s+/','','Bottom Menu Icons');
                $parent_folder .= '/'.$activeicons;                
            }else{
                $parent_folder .= '/'.preg_replace('/\s+/','','Bottom Menu Icons'); 
            }
        }

     if($this->input->post('ratio'))
     {
      $imgsize = explode("x",$this->input->post('ratio'));
      $width = $imgsize[0];
      $height = $imgsize[1];
      if(($width != $img_width) && ($height != $img_height))
      {
        $error = array('error' => '<span>image ratio must be '.$this->input->post('ratio').'</span>');
        echo $error['error'];exit;
      }
     }else{
        $error = array('error' => '<span>image ratio not found.</span>');
        echo $error['error'];exit; 
     }
     if($this->input->post('deviceid') == '1')
      $devicetype = 'Android';
     if($this->input->post('deviceid') == '2')
      $devicetype = 'Iphone';
      $config['upload_path'] = './apps/'.$this->input->post('appid').'/'.$devicetype.'/'. $parent_folder;
                   if (!is_dir($config['upload_path'])) {
                        mkdir($config['upload_path'], 0777, true);
                        $myFile = $config['upload_path']."/index.html"; // or .php   
                        $fh = fopen($myFile, 'w'); // or die("error");  
                        $stringData = "<html><head><title>403 Forbidden</title></head><body><p>Directory access is forbidden.</p></body></html>";   
                        fwrite($fh, $stringData);
                       }

     $newFileName = $_FILES['image']['name'];
     $fileExt = array_pop(explode(".", $newFileName));
     $filename = md5(time()).".".$fileExt;
    //set filename in config for upload
     $config['file_name'] = $filename;
     $config['allowed_types'] = 'gif|jpg|png|jpeg';
     $config['max_width']  = $width;
     $config['max_height']  = $height;
     $config['overwrite'] = TRUE;

     $this->load->library('upload', $config);
     $this->upload->initialize($config);
     if ( ! $this->upload->do_upload('image'))
     {
      $error = array('error' => $this->upload->display_errors('<span>','</span>'));
      echo $error['error'];
     }
     else
     {

      $_POST['bg_image'] = $parent_folder.'/'.$filename;//$data['upload_data']['file_name'];
      $devappid = $this->Application_model->getUserAllApps($this->input->post('appid'));
      $_POST['app_details_id'] = $devappid[0]['app_details_id'];
      $this->Application_model->saveImageProperties($_POST);
      echo 'success`'.$parent_folder.'/'.$filename;//$data['upload_data']['file_name'];
     }

}

Answer 1

当您使用jquery时，您可以使用下面的jquery事件。

$('#upimg').change(function(){
     //do your task here
})

addEventListener不适用于图像上传

1 个答案: