How to limit type of the uploaded file in html?

Question

Currently I am using the solution provided by this answer in my file upload page. But using the solutions here I found that when the file type is switched to All files, all files of any type is shown and able to upload. (I mean once we clicked the file upload button window is appeared showing our local directories. There is an option at the bottom right corner to change the file type) How do I prevent it?

Answer 1

Finally found this Javascript function which works fine.

var fl = document.getElementById('file');

 fl.onchange = function(e){
     var ext = this.value.match(/\.(.+)$/)[1];
     switch(ext)
     {
         case 'mp4':
         case 'mov':
         case 'mpg':
         case 'avi':
             alert('allowed');
             break;
         default:
             alert('not allowed');
             this.value='';
     }
 };