Question

我想为每个“按钮”类都有一个动态事件处理程序。处理程序必须单击显示“邻居”列的内容。我在考虑用类标记内容，例如“图片内容”，“视频内容”，当循环遍历所有按钮类时，第一个“图片内容”或“视频内容”类将成为点击时显示的目标。或者有更好的...更顺畅的解决方案吗？

<div class="row">
    <div class="col-md-7" >
        <div class="col-md-11 col-md-offset-1" >
            <div class="col-md-12">
                <p class="news line">
                <!-- Button for displaying Video content --> 
                <a href="javascript:void(0);" class="button"> Show</a> 
                </p>
            </div>
        </div>
    </div>
    <div class="col-md-5" >
        <div class="col-md-11 video">
            <div class="col-md-12 video-content">
            <!-- Video content -->
            </div>
        </div>
    </div>
</div>

Ps：我正在使用bootstraps 3，如果重要的话。

Answer 1

使用类很好。

您的模式应该是获取父.row，然后从那里获得.video-content。

试试这个：

$('.button').on('click',function(){
    $(this).closest('.row').find('.video-content,.picture-content').show();
});

演示here

Answer 2

您可以使用.on()绑定事件，例如

$('.button').on('click',function(){
    $(this).closest('.row').find('.video-content').show();
});

动态事件处理程序

2 个答案:

演示here