Question

这是我的工作fiddle。如果您单击＆＃34;更多可点击内容＆＃34;，将显示相关内容，这些内容实际上不是儿童内容。所以，我必须这样做这个功能：

$('body').on('click', '.show', function() {  
   $(this).parent().addClass('active');
   if($('#first').hasClass('active')) {
      $('#first-child').show();
   } else {
      $('#first-child').hide();
   };
});

但是，如果我可以在父href处添加li相关内容Id，我将能够使用更小的jQuery代码来管理功能：

<li id="first" href="#first-child"></li>

$('body').on('click', '.show', function() {  
   childId = $(this).parent().href
   childId.show();
});

所以，我不需要每次都检查if else。但是，W3c验证可能不允许href li。那么，我如何将这些不同的内容联系起来呢？

Answer 1

您可以使用数据属性

<li id="first" data-id="first-child"></li>

和javascript

$('body').on('click', '.show', function() {  
   childId = $(this).parent().data('id')
   $('#' + childId).show();
});

<强>更新

你在节目课上跳过点

$('.show').removeClass('open');

如何链接或制作相关的两个不同的内容

1 个答案: