I am using XMLHttpRequest to upload images to our server, and it works fine on (Firefox, Chrome, and Safari) when using a desktop and laptop.

When using iPhone to upload images, it failed without errors. The following is my upload function, and I am struggling with many hours please help. Thank you very much.

function ajaxFileUpload() 
 {

    var form = $('#imageform');
    files = form.find('[type="file"]');           

    if (files.length == 0) { 
       return;
    }


    var url = form.prop("action") 
    $('#loading').show();

    fileSelect = form.find('[type="file"]');
    
    var files = fileSelect[0].files;
    var fd = new FormData();
    for (var i = 0; i < files.length; i++) {
         var file = files[i];
         
         //remove deleted images from previous start
         var is_img_removed = false;
         for (j=0; j<imgList_removed.length; j++) {
            if (imgList_removed[j] == file.name) {
                is_img_removed = true;
                break;
            }
         }
         
         if (is_img_removed == true) {
            continue;
         }
         
         //remove deleted images from previous end
         fd.append('fileToUpload', file);
    }
    
    var xhr = new XMLHttpRequest();
    xhr.addEventListener('readystatechange', function(e) {
        if( this.readyState === 4 ) {
            form.find(":file").val("");
            alert('upload successfully');
        }
    });    
 
    xhr.open("POST", url, true);
    xhr.setRequestHeader('Accept-Encoding', 'multipart/form-data'); 
    
    xhr.send(fd);

    return false;
  }