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

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

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

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

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

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

这似乎只是随机工作,这让我抓狂。有时一些或所有视频从关闭的某个地方继续播放,与新视频内容重叠。此外,它们没有出现在 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);