Tenho um formulário onde a foto aparece como preview ao ser selecionada para upload:

[![inserir a descrição da imagem aqui][1]][1]


Gostaria de que, ao selecionar a foto, fizesse o upload automaticamente. Como eu passaria os valores para a página **alterar-foto.php**?

O código segue abaixo:

    <div class="faq-profile-btn">
       <label for="imagem" class="btn btn-primary waves-effect waves-light">Nova Foto</label>
       <button type="button" class="btn btn-danger waves-effect waves-light" style="margin-top: -10px" onclick="excluirImagem()">Excluir Foto</button>
    </div>
    <input type="file" name="FotoPerfil" id="imagem" onchange="previewImagem()">
    <div>    

        <script>
        function previewImagem(){
    
          var input = document.getElementById("imagem");
          var nome = input.files[0].name;
          var extensao = nome.split('.').pop();
    
          if(extensao != 'jpeg' && extensao != 'jpg' && extensao != 'png'){
             $('#acessar').modal('show');
          }else{
            var imagem = document.querySelector('input[name=FotoPerfil]').files[0];
            var preview = document.querySelector('img');
            var reader = new FileReader();
    
            var data = new FormData();
            data.append('FotoPerfil', $('#imagem')[0].files[0]);
            
            $.ajax({
                url: 'alterar-foto-perfil.php',
                data: data,
                processData: false,
                contentType: false,
                type: 'POST',
                success: function(data)
                {
                    alert(data);
                }
            });
    
            reader.onloadend = function () {
                preview.src = reader.result;
            }
            if(imagem){
                reader.readAsDataURL(imagem);
            }else{
                preview.src = "";
            }
        }
      }
        function excluirImagem(){
             var preview = document.querySelector('img');
             preview.src = "img/foto_usuario.png";
        }
    </script>


Ao usar o código acima, ele me retorna valor 0.

  [1]: https://i.sstatic.net/CADwF.png