Auto-play an HTML5 video on Dom Load using jQuery

后端 未结 3 650
野的像风
野的像风 2021-01-18 07:38

I\'m trying to play a video as soon as the dom has loaded using jQuery. This is my code:

HTML

相关标签:
3条回答
  • 2021-01-18 07:41

    I know is not jQuery but in standard javascript with html5 you can use:

    var video = document.getElementById("target_video");
    video.autoplay = true;
    video.load(); 
    
    0 讨论(0)
  • 2021-01-18 07:44
    $('video#video').each( (i,e) => e.play() );
    

    As Justin McDonald noted, the play() method exists on the Video DOM Node itself, so you first have to resolve the jQuery Object to the specific Node. However, his solution will throw an error if the element with id="video" does not exist or is not a video Node.

    0 讨论(0)
  • 2021-01-18 07:53

    The jQuery selector $("#video") returns a jQuery object. Since play() is a function of the DOM element, you must get the DOM element with:

    $("#video").get(0);
    

    before using .play() method:

    $("#video").get(0).play();
    

    Edit: You can also use HTML5 selected tags in case jQuery fall back. Note the autoplay tag.

    <video controls="controls" autoplay="autoplay" loop="loop"
    width="233" height="147" poster="//www.cdn.com//video.png"
    preload="auto" title="Video">
        <source src="//www.cdn.com/video.mp4" type="video/mp4"/>
        <source src="//www.cdn.com/video.ogv" type="video/ogv"/>
        <source src="//www.cdn.com/video.webm" type="video/webm"/>
    </video>
    
    0 讨论(0)
提交回复
热议问题