2016-06-07 55 views
0

我试图用jquery按下特定按钮时将某些视频静音。jquery在div中选择视频并将它们静音

我有这样的HTML代码

<button id="mute">Mute all</button> 
<button id="unmute">Unmute all</button> 

<div id="displayer"></div> 

的事情是,在某些时候,我的显示器会充满这样的:

<div id="displayer"> 
    <div id="row0" class="row"> 
     <div class="col-md-2"> 
      <video id="recorded0" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded1" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded2" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded3" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded4" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded5" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
    </div> 
    <div id="row1" class="row"> 
     <div class="col-md-2"> 
      <video id="recorded6" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded7" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
     <div class="col-md-2"> 
      <video id="recorded8" autoplay="" loop="" src="some_video" controls=""></video> 
     </div> 
    </div> 
</div> 

这里是我的javascript代码:

$("#mute").click(function() { 
    $("#displayer > video").prop('muted', true); 
}); 

$("#unmute").click(function() { 
    $("#displayer > video").prop('muted', false); 
}); 

,它不起作用。我不明白为什么。有人能帮我吗 ?

+1

,而不是'$( “#显示器>视频”)''试$( “#显示器的视频”)' –

+0

您是否尝试过寻找了CSS选择器? – gcampbell

+0

@KartikeyaKhosla的伟大工程,谢谢。 – Devz

回答

4

$(“#显示器”>视频“)是指让那些直接孩子#displayer的的所有视频元素#displayer的唯一直接孩子是你的DIV行

试试这个。:

$("#displayer video") 
+0

谢谢,我明白了! – Devz

相关问题