Как отключить звук видео с помощью JavaScript или jQuery?

Я хочу использовать следующие рекламные коды, но у меня проблема с отключением звука после закрытия видео. Когда я закрываю (дополнительно закрывается автоматически через 20 секунд) рекламу, она воспроизводит видео в фоновом режиме, но звук все равно остается. Как отключить звук видео после того, как я нажму кнопку ПРОПУСТИТЬ ОБЪЯВЛЕНИЕ, и когда оно автоматически закрывается? У меня нет знаний о jQuery или JavaScript. Не могли бы вы изменить мой код и опубликовать решение?

<script>
  window.setTimeout("document.getElementById('closead').style.display='none';", 6000);
</script>
<div class = "advertisement" id = "closead">
  <a target = "_blank" rel = "nofollow" href = "http://www.sitename.com">
    <video id = "dbx" style = "object-fit: fill;" autoplay = "" width = "100%" height = "100%">
      <source src = "https://www.w3schools.com/tags/mov_bbb.mp4" type = "video/mp4">
    </video>
  </a>
  <button onfocus = "this.blur();" class = "closecss" style = "position:absolute;bottom: 2px;right: 0px;z-index: 999;background: #32b02b;color: #fff;padding: 13px;border-radius: 4px;font-weight: bold;cursor: pointer;border: 1px solid #2b9825;box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15), 0 1px 0 0 #299023, 0 2px 3px 0 rgba(0, 0, 0, 0.25);" onclick = "document.getElementById('closead').style.display='none';">SKIP AD</button>
</div>

<style>
  .advertisement {
    position: absolute;
    z-index: 99;
    height: 100%;
  }
</style>

Разве не имеет смысла полностью удалить видеоэлемент из DOM при нажатии кнопки пропуска? Таким образом вы полностью избежите проблемы с отключением звука.

Rory McCrossan 25.05.2018 09:24

Как я могу это сделать? Извините, но у меня недостаточно знаний об этих вещах.

Yearmaz 25.05.2018 09:36
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
2
2 533
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Вы можете отключить видео с помощью атрибута отключения звука

jQuery("#dbx").prop('muted', true);

Можете ли вы изменить мои коды и добавить этот код? Как я уже сказал, я ничего не знаю о jQuery и Javascript :(

Yearmaz 25.05.2018 09:42

Измените свой сценарий для этого: <script> window.setTimeout ("document.getElementById ('closead'). Style. display = 'none'; docum‌ ent.getElementById ('‌ dbx'). Prop ('приглушено ', t‌ rue); ", 6000); </script>

Enavar 25.05.2018 10:07

К сожалению, это не сработало. Я также отредактировал кнопку ПРОПУСТИТЬ ОБЪЯВЛЕНИЕ на onclick = "document.getElementById ('closead'). Style.display = 'n‌ one'; document.getEle‌ mentById ('dbx'). Prop‌ ('приглушено', true); " . Но он все тот же, он не отключается, когда я нажимаю кнопку ПРОПУСТИТЬ ОБЪЯВЛЕНИЕ.

Yearmaz 25.05.2018 10:40
Ответ принят как подходящий

попробуйте этот Yearmaz

Как говорится в ответе Энавара, просто положите

$("#dbx").prop('muted', true);

строка в $ (document) .ready (function () {});

.advertisement {
    position: absolute;
    z-index: 99;
    height: 100%;
  }
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  window.setTimeout("document.getElementById('closead').style.display='none';", 6000);
</script>
<div class = "advertisement" id = "closead">
  <a target = "_blank" rel = "nofollow" href = "http://www.sitename.com">
    <video id = "dbx" style = "object-fit: fill;" autoplay = "" width = "100%" height = "100%">
      <source src = "w3schools.com/tags/mov_bbb.mp4" type = "video/mp4">
    </video>
  </a>
  <button onfocus = "this.blur();" class = "closecss" style = "position:absolute;bottom: 2px;right: 0px;z-index: 999;background: #32b02b;color: #fff;padding: 13px;border-radius: 4px;font-weight: bold;cursor: pointer;border: 1px solid #2b9825;box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15), 0 1px 0 0 #299023, 0 2px 3px 0 rgba(0, 0, 0, 0.25);" onclick = "document.getElementById('closead').style.display='none';MuteVideo()">SKIP AD</button>
</div>

<script>
  function MuteVideo(){
    $("#dbx").prop('muted', true);
  }
</script>

Спасибо за Ваш ответ. Но куда мне добавить этот код? $ (документ) .ready (функция () {$ ("# dbx"). prop ('приглушено', true);});

Yearmaz 25.05.2018 10:11

проверьте сейчас, просто поместите этот тег скрипта под свой <div class = "реклама" id = "closead"> div, и он должен работать!

Dhaval Pankhaniya 25.05.2018 10:13

Спасибо. Я жду. И не могли бы вы изменить URL видео на w3schools.com/tags/mov_bbb.mp4

Yearmaz 25.05.2018 10:14

Я пробовал этот код, но видео запускается без звука. Я не хочу отключать звук, когда активна реклама. Я просто хочу отключить его, когда нажимаю кнопку «Пропустить рекламу».

Yearmaz 25.05.2018 10:22

я не уверен, сможем ли мы это сделать или нет

Dhaval Pankhaniya 25.05.2018 10:37

Можете ли вы попробовать сейчас, я добавил код, который отключает звук только при нажатии кнопки пропуска добавления. и дайте мне знать, если я ошибаюсь

Dhaval Pankhaniya 25.05.2018 10:39

Если вы можете изменить верхний сценарий, это хороший способ.

<script>
	function removeVIdeo(videoId){
  	var video = document.querySelector(videoId);
    video.muted = true;
  }
  
  window.setTimeout(function(){
  	document.getElementById('closead').style.display='none';
    removeVIdeo('#dbx');
  },6000);
</script>
<div class = "advertisement" id = "closead">
  <a target = "_blank" rel = "nofollow" href = "http://www.sitename.com">
    <video id = "dbx" style = "object-fit: fill;" autoplay = "" width = "100%" height = "100%">
      <source src = "https://www.w3schools.com/tags/mov_bbb.mp4" type = "video/mp4">
    </video>
  </a>
  <button onfocus = "this.blur();" class = "closecss" style = "position:absolute;bottom: 2px;right: 0px;z-index: 999;background: #32b02b;color: #fff;padding: 13px;border-radius: 4px;font-weight: bold;cursor: pointer;border: 1px solid #2b9825;box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15), 0 1px 0 0 #299023, 0 2px 3px 0 rgba(0, 0, 0, 0.25);" onclick = "removeVIdeo('#dbx');">SKIP AD</button>
</div>

<style>
  .advertisement {
    position: absolute;
    z-index: 99;
    height: 100%;
  }
</style>

Большое вам спасибо! Это тоже сработало. Я проверил ответ Дхавала Панхания как Решенный, потому что он опубликовал первым :) Но ваши коды тоже работают без проблем. Еще раз спасибо.

Yearmaz 25.05.2018 11:42

Он будет переключаться между выключением и включением звука.

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
$("video").click(function () {
    $(this).prop("muted", !$(this).prop("muted"));
});

Другие вопросы по теме