切换通过数据ID不能切换

我有一个脚本，隐藏.wc-gallery onload，然后切换p与data-id点击。现在，只有当您第一次切换.wc-gallery时，此脚本才起作用。当您要切换回hide()时，它将不起作用。切换通过数据ID不能切换

我有多个.gallery-container2在我的HTML中声明。虽然它可以正常工作，但当我有一个当前活动的时候，然后点击另一个p从其他.gallery-container2它变成active一个hide()然后把最近点击show()。

HTML：

<div class="gallery-container2"> 
    <p data-id="1723"><strong>View before and after</strong></p> 
    <div class="gallery-item" data-id="1723"> 
     <div class="wc-gallery" style="display: none;"></div> 
    </div> 
</div>

SCRIPT：

$(window).load(function() { 
     $(".gallery-container2 .gallery-item .wc-gallery").hide(); 
    }); 
    $(".gallery-container2 p").click(function() { 
     var id = $(this).data('id'); 
     $(".gallery-container2").find('.gallery-item').each(function() { 
      $(this).find('.wc-gallery').toggle($(this).data('id') === id); 
     }); 
    });

来源

2016-08-18 MIke

你选择'$（”。库-container2" 的）。找到（‘库项目’）'可能是由于您声明页面上有该类的多个元素，因此不够具体。你可以更新它到$（this）.find（'。gallery-item'）'或使用你已经找到的id值在数据id属性上选择 – ken4z

很确定我无法使用'$ （this）.find（'。gallery-item'）''因为我使用'.gallery-container2 p'，它不起作用，但如果你可以帮助改变脚本并添加一些额外的结构，它会以某种方式工作？ – MIke

对不起，你是对的。 '$（“[data-id =”+ id +“] .gallery-item .wc-gallery”）。toggle（）' – ken4z

退房拨动定义为像你路过它，它并不需要一个谓语。 http://api.jquery.com/toggle/这将是更有效的，以及你将不必遍历每个.gallery-item

$(".gallery-container2 p").click(function() { 
    var id = $(this).data('id'); 
    $("[data-id=" + id + "].gallery-item .wc-gallery").toggle() 
});

来源

2016-08-18 03:49:02 ken4z

切换通过数据ID不能切换

回答

相关问题