Toggle append/remove video with jQuery

Question

Я задавался вопросом, может ли кто-нибудь помочь мне? Я пытаюсь загрузить видео на страницу с помощью jQuery при нажатии кнопки с помощью переключателя класса. И на втором щелчке я хотел бы, чтобы видео было удалено - эффективно переключать между добавлением и удалением.

Вот код до сих пор - так как он стоит, кнопка переключения просто добавляет больше экземпляров видео. Я понимаю, что до сих пор нет функции переключения, и надеялся, что кто-то сможет пролить свет на лучший способ достичь этого. Я все еще изучаю jQuery :)

$(function(){ 
    $('.toggle').click(function(e) { 
    e.preventDefault(); 
    var content = '<video id="my_video"><source src="animation.mp4" type="video/mp4"/></video>'; 
    $('#videowrapper').append(content); 
    _V_('my_video', {'controls': true}); 
    }); 
}); 

Большое спасибо за любую помощь!

Answer 1

$('.toggle').click(function(e) { 
    e.preventDefault(); 
    if ($('#my_video').length) { 
     $('#my_video').remove(); 
    } 
    else { 
     var content = '<video id="my_video"><source src="animation.mp4" type="video/mp4"/></video>'; 
     $('#videowrapper').append(content); 
     _V_('my_video', {'controls': true}); 
    } 
}); 

Answer 2

Добавьте проверку, если есть видеоигра, если да, удалите ее.

$(function(){ 
    $('.toggle').click(function(e) { 
    e.preventDefault(); 
    var content = '<video id="my_video"><source src="animation.mp4" type="video/mp4"/> </video>', 
     search = $('video#my_video').length; 
    if(search > 0) { 
     $('video#my_video').remove(); 
    } else { 
     $('#videowrapper').append(content); 
     _V_('my_video', {'controls': true}); 
    } 
    }); 
}); 

Что-то вроде этого должно быть достаточно.

Благодарим за то, что вы меня запустили, я случайно нажал вкладку, чтобы сделать пробелы, которые сосредоточились на пост-кнопке, а затем я нажал кнопку ввода, потому что мне нужна новая строка, и она разместила мое сообщение до того, как я закончил: P

Answer 3

$('#videowrapper').html(content); 

Answer 4

$(function(){ 
    $('.toggle').click(function(e) { 
     e.preventDefault(); 
     if ($("#my_video").length) { 
      $("#my_video").remove(); 
     }else{ 
      var content = '<video id="my_video"><source src="animation.mp4" type="video/mp4"/></video>'; 
      $('#videowrapper').append(content); 
      _V_('my_video', {'controls': true}); 
     } 
    }); 
});