Javascript jQuery显示/隐藏动态元素

我想在单击

h3

标记时隐藏/显示

ul

元素。我试过一些例子，也许我遗漏了什么

我的示例代码：

$('#gallery').append('<h3 id="' + idx + '" >' + item.title._content + '</h3><ul style="display:none;" class="photos grp' + idx + '"></ul>');

$('h3#'+idx).click(function () {
   $(this).next('.photos.grp'+idx).toggle();
});

$（'#gallery'）。追加（''+item.title.\u content+'
）；
$（'h3#'+idx）。单击（函数（）{
$（this.next（'.photos.grp'+idx.toggle（）；
});

因为您是动态的，所以应该使用此

var id = 'h3#'+idx;
$('#gallery').on('click',id,function(){
    $(this).next('.photos.grp'+idx).toggle();
})

试试这个：

$('h3#'+idx).on('click',function () {
       $(this).next('.photos.grp'+idx).toggle();
  });

Because you are appending html from jquery then use `.on()` shown above.

将处理程序附加到与事件匹配的所有元素的一个或多个事件 选择器，现在或将来，基于一组特定的根 元素

您可以使用jQuery委托事件处理程序，该处理程序可用于动态添加的元素

e、 就你而言

$('#gallery').append('<h3 id="' + idx + '" >' + item.title._content + '</h3><ul style="display:none;" class="photos grp' + idx + '"></ul>');

$('h3#'+idx).on('click', function() {
   $(this).next('.photos.grp'+idx).toggle();
});

---

在这里，#gallery是所有子元素的父元素。

看起来缺少一些代码，可能是一个循环？发布所有内容，以便我们可以看到变量是如何定义的等+您需要在上使用（'click'而不是clickPost）完成代码，如果您使fiddle与示例fiddle重复，则更好：在html中添加可能我的解释中遗漏了一些内容，请在jsbin上查看我的代码，我将尝试使用、触发器和其他许多内容。。

$('#gallery').append('<h3 id="' + idx + '" >' + item.title._content + '</h3><ul style="display:none;" class="photos grp' + idx + '"></ul>');

$('h3#'+idx).on('click', function() {
   $(this).next('.photos.grp'+idx).toggle();
});

$('h3#'+idx).delegate('#gallery', 'click', function() {
   $(this).next('.photos.grp'+idx).toggle();
});