Question

在CMS中，我想将视频设置为DIV中的背景。为此，我使用以下3条jquery行：

1. $(top.activeBaseElement).css('background-image', 'url(' + obj_backgroundImage + ')');
2. $(top.activeBaseElement).addClass('fcontent-video-bg');
3. $(top.activeBaseElement).prepend(' <video class="vid-bg-cont" loop muted autoplay poster="..."><source src="' + obj_backgroundImage + '" type="video/mp4"></video>' );

top.activeBaseElement 是应获取BG视频的DIV容器：

<div class="fcontent fcontent-video-bg" ...>
  <video loop muted autoplay poster="...">
    <source src="..." type="video/mp4">
  </video>
...

第1行仅将视频作为背景图像写入相应对话框中的预分配/显示。第2行添加了一些样式的类，第3行添加了DIV中的视频容器。很棒！

要再次删除视频，请使用以下3行：

1. $(top.activeBaseElement).css('background-image', '');
2. $(top.activeBaseElement).removeClass('fcontent-video-bg');
3. $(top.activeBaseElement + ' > video').remove();

第3行导致以下错误：未捕获的错误：语法错误，无法识别的表达式：[object Object]> video

似乎DOM删除不支持将视频作为元素？

我也尝试过$(top.activeBaseElement + ' > .vid-bg-cont').remove();或仅尝试$('.vid-bg-cont').remove();

什么都不起作用...

我该如何再次摆脱视频元素？我绝望了，什么也没找到谢谢，问候你

Answer 1

好的，我认为这与video元素本身无关。我现在在视频元素周围放置了DIV：

<div class="fcontent" ...>
  <div class="vid-bg-cont">
    <video ...>
      <source... />
    </video>
  </div>
  <div>
    ... regular content in fcontent
  </div>
  <div>
    ... still more regular content in fcontent
  </div>
</div>

$(top.activeBaseElement + ' > .vid-bg-cont').remove();也不起作用（有错误）

$(top.activeBaseElement + ' > .vid-bg-cont').empty();不起作用（没有错误，但是vid-bg-cont的内容仍然存在！）

$(top.activeBaseElement).remove();起作用并删除了完整的fcontent-container，$(top.activeBaseElement).empty();也起作用并清除了fcontent-container（仅此2作为测试）...

我认为这是由于引用导致的-但我不明白... （我正在使用jquery2。我不确定与此是否有任何关系。出于兼容性原因，我不能并且现在不想更新jquery ...）

Answer 2

代码的问题可能是因为，您试图将jQuery对象与字符串连接在一起。这就是为什么它给出了错误。

只需用以下内容替换第三行：

$(top.activeBaseElement).children('.vid-bg-cont').remove();

摆脱视频元素

2 个答案: