0

我将不胜感激有关 jQuery 的帮助。在这里，一切正常： jsfiddle-这很好

但是在这里，同一页面上有两个相同的 HTML 块，它们发生冲突（它们相互干扰，当您单击第二个块中的“显示”时，它会影响第一个块）： jsfiddle - 问题

有没有办法改变 JS（正确使用 .closest()、.find() 和其他遍历技术），以便我可以根据需要在同一页面上拥有尽可能多的这些块并且全部独立工作？（无需发明新的 ID 并增加 JS 代码）。

我可以轻松遍历<li>，但是可以使用 DIV 吗？

编辑：（ 我没有任何声誉，所以使用编辑：非常感谢您的帮助和对ID的额外刷刷。一切正常。

一切顺利）

4

1 回答 1

3

您有 id 重复（将它们转换为 classnames .funFactAnswer）并且您的选择器是通用的，使其更具体到目标。

 $(document).ready(function () {
      $(".showfunFactAnswer").click(function () {
         var $this = $(this);
         $this.closest('.funFactWrap').find('.funFactAnswer').slideDown()
         $this.next().removeClass("hide");
     });
     $(".hideButtonAnswer").click(function () {
         $(this).addClass("hide").closest('.funFactWrap').find('.funFactAnswer').slideUp()
     });

 });

小提琴

使用重复 id 时，id 选择器将仅选择具有相同 id 的元素的第一个实例。

于 2013-10-19T17:42:31.653 回答