video.play() работает только при щелчке

Question

Прежде всего, в компьютерных браузерах все в порядке. У меня есть следующая проблема только на mobile !!

У меня есть HTML видео, как это:

<video id="myVid" poster="poster.png" muted autoplay loop> 
     <source src="vid.webm" type='video/webm'> 
     <source src="vid.mp4" type='video/mp4'> 
</video> 

Это не autoplayed на мобильном телефоне, так что я должен заставить играть его с помощью JavaScript: Я использовал

$('#myVid').click(function() { 
    $('#myVid').get(0).play(); 
}); 

Это работает, но это не делает работающие на $ (документ) .ready():

$(document).ready(function() { 
    $('#myVid').get(0).play(); 
}); 

Answer 1

Autoplay не работает со всеми версиями iOS и современными версиями Android. Это делается для предотвращения чрезмерного использования полосы пропускания.

Технически это должно быть возможно, однако я не тестировал его.

Попробуйте изменить часть кода, который у вас уже есть немного:

$('body').on('click', '#myVid', (function() { 
    $(this).get(0).play(); 
}); 

Затем вызвать нажмите на этом элементе с некоторой задержкой, когда страница завершения загрузки:

$(document).ready(function() { 
    setTimeout(function() { 
     $('#myVid').trigger('click') 
    }, 100); 
});