javascript - 在事件的Bootstrap轮播幻灯片中定位iframe元素，并向SRC属性添加哈希？

我在页面的Bootstrap carousel中嵌入了iframe元素。这是我的HTML：

<div id="carousel1" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel1" data-slide-to="0" class="active"></li>
<li data-target="#carousel1" data-slide-to="1"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<iframe src="http://iframe.url/index.html" width="160" height="600" frameborder="0"></iframe>
</div>
<div class="item">
<iframe src="http://another.iframe.url/index.html" width="300" height="600" frameborder="0"></iframe>
</div>
</div>
<a class="left carousel-control" href="#carousel1" role="button" data-slide="prev">
<span class="icon-prev" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel1" role="button" data-slide="next">
<span class="icon-next" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

我需要编写脚本的帮助，该脚本将定位可见的幻灯片并将#play附加到iframe元素SRC属性。我想我可以通过定位Bootstrap .item .active类来做到这一点，这些类在轮播中可见幻灯片时会自动设置。

例如，活动幻灯片iframe元素应如下所示：<iframe src="http://another.iframe.url/index.html#play" width="300" height="600" frameborder="0"></iframe>

如何使用Javascript或jQuery完成此操作？感谢您的帮助。

我开始写一个想法来解决这个问题，但是没有用：

// Trigger Active Slide to Play
$('.carousel').carousel().on('slid.bs.carousel', function(e) {
$(this).find('.active.item').('iframe', e.relatedTarget) {
    $(this).attr('src', $(this).attr('src') + '#play');
});
});

编辑我一直在想出一个解决方案。这仍然不起作用，但我认为它越来越接近我要寻找的东西：

// Trigger Active Slide to Play
$('.carousel').on('slid.bs.carousel', function() {
var activeItem = $(this).find('.active.item');
if (parent().is(activeItem)) {
    $(this).find('iframe').attr('src', function() {
        return $(this).attr('src') + "#play"
    })
    }
});

最佳答案

有一个工作代码：

    $('.carousel').on('slide.bs.carousel', function () {
      $(this).find('.active.item').attr('src', function(){
        return $(this).attr('src') + "#play"
      })
     });

您在“ slide.bs.carousel”中输入了错误，也没有必要尝试使用事件，否则逻辑很好。

确保将#play停用后将其删除。