使用jquery

Question

我有一个模板允许页面上有多个royalslider视频（我不会将视频直接嵌入到模板中，因为客户希望使用他们自己的高分辨率图像作为占位符）。我为每个设置了一个播放按钮，但是当单击一个时，所有播放。如果我使用idx值动态改变类（即.myclass-0，.myclass-1，.myclass-2等），我如何改变我的jquery代码来定位每一个？

<li class="gallery-item large-12 columns collapse royalSlider rsDefault vidImg">
<div class="vidLaunch">
    <div class="defer-image image-ratio:16x9">
        <div class="rsImg" src="[[+file_url:phpthumbof=`w=970&h=546&q=80&zc=1`]]" data-rsVideo="[[+url]]" alt="[[+name]]"></div>
    </div>
</div>

 $('.vidLaunch').click(function() {
    $('.royalSlider').royalSlider('playVideo');
});

Answer 1

您可以使用正则表达式匹配所有具有以myclass-开头的类的元素（您将使用属性选择器）：

$('[class^="myclass-"]').royalSlider("playVideo");

另一方面，您可以将另一个类附加到这些元素并选择它们：

$(".awesome-video").royalSlider("playVideo");