首页 > 解决方案 > 如果视频源为空,如何通过 jQuery 隐藏 div?

问题描述

如果 src 为空,如下所示,我想隐藏 video_wrapper 类

<div class="video_wrapper" style="width: 100%; height: 100%; display: none;">
  <video id="df-video" playsinline="" webkit-playsinline="" style="height: 100%; width: 100%;"> 
    <source  src="" type="video/mp4">
  </video>
</div>

我尝试了以下 jquery,但当 src 具有任何视频格式时它也会隐藏。

if ( jQuery('video[src][src=""]') )
   jQuery(".video_wrapper").hide();
else
   jQuery(".video_wrapper").show();

https://jsfiddle.net/v87b5feq/

标签: javascriptjquery

解决方案


实际上,您正在寻找内部video具有source元素的元素,其属性src为空:

$('video source[src=""]')

这是基于您的代码的示例:

$('video source[src=""]').each(function() {
  $(this).parents('.video_wrapper').hide();
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="video_wrapper" style="width: 100%; height: 100%;">
  <video id="df-video" playsinline="" webkit-playsinline="" style="height: 100%; width: 100%;"> 
    <source  src="" type="video/mp4">
  </video>
</div>

<div class="video_wrapper" style="width: 100%; height: 100%;">
this will not be hidden
  <video id="df-video" playsinline="" webkit-playsinline="" style="height: 100%; width: 100%;"> 
    <source  src="b" type="video/mp4">
  </video>
</div>


推荐阅读