Question

我有这种情况，我需要点击其他元素点击某个元素。更具体地说 - 我有缩略图的画廊。将鼠标悬停在缩略图上时，说明框将覆盖整个缩略图。之后，我需要在缩略图上触发点击事件，以便它可以运行灯箱。要实现这一点，我需要在点击描述时做点什么。

这是html：

<div id="gallery">
<!-- Content from handlebars that is loaded dynamicaly from template file via ajax -->
    <a class="lightbox lightbox-frame" href="img/gallery/{{filename}}.jpg" data-lightbox="gallery" data-category="{{category}}">
        <img src="img/gallery/thumbs/{{filename}}.jpg" alt=""/>
    </a>
    <p class="gallery-image-description">{{description}}</p>
<!-- Content from handlebars -->
</div>

我正在尝试这个，但它不起作用。它适用于statick内容，但此内容通过Ajax加载，然后使用Handlebars编译：

('#gallery').on('click', '.gallery-image-description', function () {
    $(this).prev().click();
});

所以问题是：您是否知道如何通过点击其他元素来触发动态生成内容上的点击事件？

Answer 1

我不确定这会有所帮助，因为我从未使用过lightbox，而且我无法确定lightbox和JS之间是否存在交互。

但这是一个FIDDLE

具有动态生成的div / image

悬停时，用文字覆盖图像

点击父母会弹出警告

JS

$('.imagestuff').on('click', function(){
       alert('clicked');
});

无法触发点击以生成动态内容

1 个答案: