Get input type file value using jquery

$(document).ready(function(){
  $('#fileInput').change(function(){
  var fileName = $(this).val().split('\\').pop(); // Get only the file name
    alert("Selected file: " + fileName);
  });
});

$(document).ready(function(){
  $('#fileInput').change(function(){
    var file = $(this).prop('files')[0]; // Get the first file
    if (file) {
       console.log("File Name: " + file.name);
       console.log("File Size: " + file.size + " bytes");
       console.log("File Type: " + file.type);
    }
  });
});

Read and Preview

$(document).ready(function(){
   $('#fileInput').change(function(event){
   var file = event.target.files[0];
   if (file) {
     var reader = new FileReader();
     reader.onload = function(e) {
     $('#preview').attr('src', e.target.result);
   };
   reader.readAsDataURL(file);
  }
 });
});