How to check if the browser can play mp4 via html5 video tag?

问题

回答1:

This might help you:

<script type="text/javascript">'.
   var canPlay = false;
   var v = document.createElement('video');
   if(v.canPlayType && v.canPlayType('video/mp4').replace(/no/, '')) {
       canPlay = true;
   }

   alert(canPlay);

</script>

回答2:

Alex Polo's reply is not bad but incomplete try this to check if the codec is supported too:

var mp4Supported = (!!document.createElement('video').canPlayType('video/mp4; codecs=avc1.42E01E,mp4a.40.2'));

Likewise for ogg, webm and so on ... Works with audio too :)

回答3:

This following link explains how:

http://diveintohtml5.info/detect.html#video-formats

回答4:

I have to check if the html5 video is displayed, to hide my personal button to play and turn audio off in ie7 and ie8. My solution is shown below.

My html:

<div id="contenitore_video" style="position:absolute;top:0;left:0;">
    <video id="cont_video"  autoplay onFocus="this.blur();" width="100%" height="100%"   >
        <source src="video/xxx.mp4" type="video/mp4" />
        <source src="video/xxx.theora.ogv" type="video/ogg" />
        <div id="sfondo_ridimensionato" >
            <img src="img/sfondo_home1.jpg"  >      
        </div>
    </video> 
</div>

...

<div id="controlli_video" style="position:absolute; top:10px;right:25px; height:50px; text-align:right;">
    <a class="video_play" onFocus="this.blur();" style="display:none;" href="javascript:void(0)" onClick="controlla_video(1)">Play</a> ...

</div

My JS ready:

$(document).ready(function(){
    //controllo se il video funziona o si vede il video alternativo
    //  var numero = $('#sfondo_ridimensionato:hidden').length;
    //  alert(numero);

    if($('#sfondo_ridimensionato:hidden').length == 0){
        $('#controlli_video').hide();       
    }
}

回答5:

I made a function to validate if your browser is able to play audio or video element

    const checkMedia = mediaType => {
    let canPlay = false
    const mediaFormat = {
      audio: 'audio/mp3',
      video: 'video/mp4'
    }
      let media = document.createElement(mediaType)
    if (
      media.canPlayType &&
      media.canPlayType(mediaFormat[mediaType]).replace(/no/, '')
    ) {
      canPlay = true
    }
      return canPlay
    }

来源：https://stackoverflow.com/questions/3572113/how-to-check-if-the-browser-can-play-mp4-via-html5-video-tag

标签

html5

html5-video