从 DOM 中删除后视频还在播放，如何完全删除？

Video still playing after removal from DOM, how to eliminate completely?

我的网站上有一个容器，每当某种类型的 link 出现时，我就会通过 jQuery Ajax/XHR 动态注入新内容点击。

对于某些页面，此容器包含一个网格，其中有多个 HTML5 <video> 元素循环播放。

在某些时候，我遇到了几次 XHR requests 替换容器内的内容后性能下降的情况。将我的视频取消静音后，我仅通过扬声器发出的音频才意识到它们实际上一直在播放，即使它们已完全从 DOM 中移除（这意味着我有很多在我的容器中进行几次 XHR 替换后播放的视频数量，这些视频实际上已经不在 DOM 中了）。

我现在尝试了一些方法，none 其中似乎有帮助：

对 XHR request 之前的所有视频使用 jQuery 的 .remove() 在我注入新内容之前从 DOM 中删除视频
在加载新内容之前通过 Javascript 暂停视频

这似乎只是随机工作，这让我抓狂。有时一些或所有视频从关闭的某个地方继续播放，与新视频内容重叠。此外，它们没有出现在 Chrome DevTool 的网络选项卡中……

我觉得由于缓冲的东西只是经典 DOM-querying 和操作在这里不起作用......我可以在我的 pre-XHR 请求函数中放入什么的任何提示以确保任何当前 [= DOM 中的 12=] 内容（和关闭，在缓冲区和其他地方）真的被 100% 删除，换句话说“被杀死”？

编辑： 这是我的问题的简化演示，尝试单击 links 将 div 的内容与 ID #content http://www.letrip.de/html5video-problem/

你可以通过在 URL

中添加 /js/app.js 来查看 Javascript

添加视频作为模板..并将此模板分配给一个变量并使用它，当您要删除它时将其设为空。

例如。 var vdo=

做你的操作然后让它为空

Vdo = null;

变化：


    var content = $(data).find('#content');
    html = content.html();
    $('#content').html(html);

至：


     var = content = $("#content",data);
     $('#content').html(content);

此致

更新只要你这样做：$(data) 问题就会 return。尝试对 return 标题执行此操作：


     var titledata = data.match("(.*?)")[1];
     console.log(titledata);

从 DOM 中删除后视频还在播放，如何完全删除？

Video still playing after removal from DOM, how to eliminate completely?

ajax

dom

html5-video

jqxhr

video-embedding