用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}); 
    } 
    }); 
}); 

像這樣的東西應該就足夠了。

感謝downvoting我，我不小心按Tab鍵製作空格，將我的注意力集中到後按鈕，然後我按enter鍵因爲我想要一個新行，並且在我完成之前發佈了我的帖子：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}); 
     } 
    }); 
});