来自此单击的 jquery 不同选择

Question

我有这段代码并不能正常工作

首先我添加一个img div

$('div.group_title a').prepend("<img src='replace_w_img_link_in_real'  width='20' height='20'  >");

然后我选择那个 div

$('.el.group_title a img').on('click', function(e){
  e.preventDefault();
  var img2 = "img_link_path_2";
  var img1 = "img_link_path_1";

  var img = $(this).attr("src");

  if (img == img1) {
    $(this).attr("src",img2);
  } else {
    $(this).attr("src",img1);
  }

  $(this).nextUntil('.el.group_title', '.sidebar_project').toggle();
});

这里的问题是 $('.el.group_title a img') 只返回一个选择，而当我这样做时 $(this).nextUntil('.el.group_title', '.sidebar_project').toggle(); 我找不到 div。

所以想法是它添加了一个 img div，当您单击该 img 时，img 会更改并隐藏/显示内容 .sidebar_project 直到下一个 img。我试图改变$(this).nextUntil('.el.group_title a img'，但没有运气

根据要求，这是基本 html

<div class="el group_title">
  <a href="link_path">NAME</a>
</div>
<div data-project-id="195677" class="sidebar_project">..</div>
<div data-project-id="9844" class="sidebar_project">..</div>
<div class="el group_title">
  <a href="link_path">NAME 2</a>
</div>
<div data-project-id="195677" class="sidebar_project">..</div>
<div data-project-id="9844" class="sidebar_project">..</div>

现在当我添加 img div 时

<div class="el group_title">
  <a href="link">
    <img alt="ACME org" src="link" width="20" height="20">org name</a>
</div>
....

这里是 jsFiddle -> http://jsfiddle.net/6fdMc/

Answer 1

很难确切地说出您要做什么，但听起来解决方案的一部分将是$( this ).closest( ".group_title" )。您是否正在尝试做某事like this？这是我在您的代码中更改的部分：

原文：

$(this).nextUntil('.el.group_title', '.sidebar_project').toggle();

新：

$( this ).closest( ".group_title" )

  .nextUntil( ".group_title", ".sidebar_project" ).toggle();