Как приостановить воспроизведение на встроенном mp4 при нажатии на динамически создаваемую кнопку?

Question

Я использую код из QuickQuiz https://github.com/UrbanInstitute/quick-quiz и изменил код для использования встроенного video (mp4) вместо img, который загружается из файла json, а также для использования SweetAlert2библиотека вместо первого SweetAlert, который изначально был реализован.Я хочу приостановить воспроизведение каждой video, когда нажата любая из четырех кнопок quiz-btn btn.Все кнопки запускают диалог SweetAlert2, используя swal.Fire.

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

document.querySelector("#quiz > div > div.item.active > div.quiz-answers > div:nth-child(1)").addEventListener("click",function() {
document.querySelector("#quiz > div > div.item.active > div.ncc.text-center > video").pause();});

, и я также попытался

$('.quiz-button btn').on('click', function() {
        $('#video').attr('src', ''); });

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

Answer 1

На самом деле это общая проблема, вам нужно изменить функцию щелчка следующим образом:

изменить $('.quiz-button btn').on('click', function() {

на

$(document).on('click','.quiz-button btn', function() {