Question

我有一个结构;

<p class = "foo">"sometext"</p>
<div class = "foo">
   <p class = "moo">"sometext"</p>
   <div class = "moo">
      <p class = "boo">"sometext"</p>
      <div class = "boo">
      </div>
  </div>
</div>

从该结构我创建一个菜单，当我点击相应的div将显示的段落。

 $("p").click(function()
      {
          $(this).next("div").toggle(); 
                     #Code that adds a minus sign before the paragraph eg. "+Mylink to "-Mylink"
       });

我现在正试图在未按下菜单的情况下获得“+”符号，如果没有则按“ - ”。我遇到的问题是一种了解如何跳过最后一步（类嘘）的方法，它不需要任何额外的标志（它不是菜单）。任何简单的方法遍历结构并添加加号？有没有简单的方法让点击功能知道它的扩展/去扩展？

Answer 1

您可以使用:has()选择器检查兄弟姐妹：

$('div:not(:has(*))').each(function() {
  $(this).prepend('-');
});

这应该有效：

$('p').prepend('<span class="toggle">-</span>');

$("p").click(function() {
  var sign = $(this).siblings('.toggle');

  $(this).next("div").toggle();

  if (sign.text() == '+') {
    sign.text('-');
  } else {
    sign.text('+');
  }
});

Answer 2

鉴于您的HTML，最简单的方法是将第一个选择器更改为

$("p:not(.boo)").click(function() {
    // ....
})

div包含div时更改div的内容

2 个答案: