将图像文件变量从JS函数传递到同一页面上的php函数

In the view, there is a option for upload image with the help of js, now i want pass that image to the php function on the same page. I have tried this code, but i don't know what to do now.

View:

<a href="" id="anchortag"><button type="button" name="userimage" class="profile-user-img img-responsive img-circle"><img class="profile-user-img img-responsive img-circle" src="<?php echo base_url();?>dist/img/user4-128x128.jpg" alt="User profile picture"></button></a>

                    <script type="text/javascript">
                      $("button").click(function(){
                      var file = new FileModal("image/png");
    file.onload = function(d){
        console.log(d);
    };

    file.show();
});


/*The FileModal Class*/
function FileModal(accept){
    var callback = function(){};
    return {
        show: function(){
            $("<input>").attr({
                type: "file",
                accept: accept
            }).appendTo("body").hide().change(function(e){
                var file = e.target.files[0],
                    reader = new FileReader();
                reader.onload = function(progress){
                    callback(progress.target.result);
                };
                reader.readAsDataURL(file);
            }).click();
        },
        set onload(c){ callback = c;
      }

    }
}
</script>