По какой причине видео не воспроизводится второй раз?

Question

[focusss]

Есть просто блок с видео внутри. При клике на блок, я отключаю звук на 0. После этого если перезагрузить страницу браузера, то видео больше не воспроизводится.

<div class="test">
    <video width="150" height="250" class="video" loop autoplay playsinline preload="auto" controlslist="nodownload" disablepictureinpicture>
        <source src="https://ucdn4.v-s.mobi/yYQ4bEgTZXNNAzX1CQ/360p.mp4" type="video/mp4">
    </video>
</div>

let block = document.querySelector('.test');
let video = document.querySelector('.video');

block.addEventListener('click', function(){
    video.volume = 0;
})

Почему так происходит?

Answer 1

[focusss]

<video id="video" autoplay loop muted>
        <source src="/v.mp4" type="video/mp4" />
    </video>
      

<button id="test">Звук</button>
<script>
var video = document.getElementById("video");
var volume = document.getElementById("test");

volume.addEventListener('click', function() {
    video.muted = (video.muted == false) ? true : false;
});
</script>

Answer 2

[Владимир Кудря]

Непонятно что значит "больше не воспроизводится", но что б тег autoplay сработал нужно muted добавлять

Comments

[focusss]

Обновляешь страницу и видео не запускается автоматически. Приходится несколько раз обновлять страницу или вносить какие-то изменения в файл, чтоб снова запустилось. В консоли ошибок нет, причину найти не могу.

video.muted = true - так тоже пробовал.

[Владимир Кудря]

focusss, так не через js mute делай, через тег

[focusss]

Владимир Кудря, Спасибо, уже решил))

<video id="video" autoplay loop muted>
        <source src="/v.mp4" type="video/mp4" />
    </video>
      

<button id="test">Звук</button>
<script>
var video = document.getElementById("video");
var volume = document.getElementById("test");

volume.addEventListener('click', function() {
    video.muted = (video.muted == false) ? true : false;
});
</script>