title: Get total duration of Audio /Video file before upload for multiple files?
body: <blockquote>
    <p>This will help me in getting the duration for a single audio file if I have multiple audio files uploaded I should be able to find the total audio length od those uploaded files.</p>
  </blockquote>
  
  <p><strong>HTML CODE</strong></p>
  
  <pre><code>&lt;form action="#" method="post" enctype="multipart/form-data"&gt;
        File: &lt;input type="file" name="fup" id="fup" /&gt;&lt;br&gt;
        Duration: &lt;input type="text" name="f_du" id="f_du" size="5" /&gt; seconds&lt;br&gt;
        &lt;input type="submit" value="Upload" /&gt;
      &lt;/form&gt;
      &lt;audio id="audio"&gt;&lt;/audio&gt;
  
      &lt;script&gt;
      // Code to get duration of audio /video file before upload - from: http://coursesweb.net/
  
      //register canplaythrough event to #audio element to can get duration
      var f_duration =0;  //store duration
      document.getElementById('audio').addEventListener('canplaythrough', function(e){
        //add duration in the input field #f_du
        f_duration = Math.round(e.currentTarget.duration);
        document.getElementById('f_du').value = f_duration;
        URL.revokeObjectURL(obUrl);
      });
  
      //when select a file, create an ObjectURL with the file and add it in the #audio element
      var obUrl;
      document.getElementById('fup').addEventListener('change', function(e){
        var file = e.currentTarget.files[0];
        //check file extension for audio/video type
        if(file.name.match(/\.(avi|mp3|mp4|mpeg|ogg)$/i)){
          obUrl = URL.createObjectURL(file);
          document.getElementById('audio').setAttribute('src', obUrl);
        }
      });
      &lt;/script&gt;
  </code></pre>