jquery在div中选择视频并将其静音

时间:2016-06-07 16:32:57

标签: javascript jquery html html5-video

我在使用jquery按下特定按钮时尝试将某些视频静音。

我有这个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 :(得分:4)

$(“#displayer”&gt; video“)表示获取所有直接子项 #displayer的视频元素。#displayer的唯一直接子项是你的div行。

请改为尝试:

$("#displayer video")