En HTML5, définissez ou renvoyez l'attribut de lecture automatique indiquant si la lecture audio et vidéo commencera après le chargement.-Tutoriel H5-php.cn

En HTML5, définissez ou renvoyez l'attribut de lecture automatique indiquant si la lecture audio et vidéo commencera après le chargement.

黄舟

Libérer： 2017-11-08 09:35:48

original

3278 Les gens l'ont consulté

Instance

Activer la lecture et le rechargement automatiques Vidéo :

myVid=document.getElementById("video1");
myVid.autoplay=true;
myVid.load();

Copier après la connexion

Définition et utilisation

lecture automatique AttributsDéfinir ou indique si la lecture audio et vidéo commencera après le chargement.

Prise en charge du navigateur

Tous les principaux navigateurs prennent en charge l'attribut de lecture automatique.

Remarque : cet attribut n'est pas pris en charge dans Internet Explorer 8 ou les navigateurs antérieurs.

Syntaxe

Définir l'attribut de lecture automatique :

audio|video.autoplay=true|false

Copier après la connexion

Renvoyer l'attribut de lecture automatique :

audio|video.autoplay

Copier après la connexion

Valeur de l'attribut

值	描述
true	指示音视频在加载完成后随即播放。
false	默认。指示音视频不应在加载后立即播放。

Détails techniques

返回值	布尔值。true\|false
默认值：	false

Lorsque la vidéo html5 utilise l'attribut de lecture automatique, le son prête à confusion

Code de la page

Index.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title> 
<meta charset=&#39;utf-8&#39;/>
<script src="js/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="js/thml5.js" type="text/javascript"></script>
<script type="text/javascript">

window.onload=function(){
$(&#39;#channel1&#39;).click(function(){
setConfig("test1.mp4");
});

$(&#39;#channel2&#39;).click(function(){
setConfig("test2.mp4");
});

$(&#39;#channel3&#39;).click(function(){
setConfig("test3.mp4");
});
}


function setConfig(url){
var jo=$(&#39;#test1&#39;);
var cfg=HTML5MediaService.getDefaultConfig();
 cfg=$.extend(cfg, {url: url});
HTML5MediaService.create(jo,cfg);
}

</script>
</head>
<body>
<div id=&#39;test1&#39; style="height:300px;width:500px;">

</div>
</br>
</br>
</br>
<div>
<span id=&#39;channel1&#39;>频道1</span>
<span id=&#39;channel2&#39;>频道2</span>
<span id=&#39;channel3&#39;>频道3</span>
</div>
</body>
</html>

Copier après la connexion

code js
html5.js

var HTML5MediaService= {
    getDefaultConfig: function () {
        return $.extend({}, {width: "100%", height: "100%", controls: "controls", autoplay: "autoplay"});
    },
    create:function(jo,cfg){
         this.videoId = "videojs_" + new Date().getTime().toString();
        var videoJo = $(&#39;<video&#39; +
            &#39; id="&#39; + this.videoId + &#39;"&#39; +
            &#39; src=&#39; + cfg.url +
            &#39; controls=&#39; + cfg.controls +
            &#39; autoplay=&#39; + cfg.autoplay +
            &#39; width=&#39; + cfg.width +
            &#39; height=&#39; + cfg.height +
            &#39; preload=none&#39; +
            &#39;></video>&#39;);
        videoJo.appendTo(jo.empty());
    }　　
   }

Copier après la connexion

Ma solution :

Supprimez la lecture automatique et utilisez la fonction play() pour obtenir la fonction de lecture automatique

;

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!