Question

<li class="view">
    <a href="#"><span>Settings</span> </a>
    <ul >
      <li ><a>Leave Settings</a></li > 
      <li ><a href="compansatorysetting.aspx">Compensatory Settings</a></li>
    </ul>
</li>

点击class="open"时，我想在<ul>中添加<li>。

我正在使用

$(".view").click(function () { 
   $(this).children().addClass("open"); 
});

它不起作用。任何解决方案？

Answer 1

您需要使用.parent()或.closest('ul')来遍历父级ul元素：

$(".view").click(function () { 
  $(this).parent().addClass("open"); 
});

如果您希望在点击的li中定位内部ul元素，请使用.find()选择器：

$(".view").click(function () { 
  $(this).find('ul').addClass("open"); 
});

Answer 2

如果您只想将open课程分配到ul，请使用以下代码。

$(".view").click(function () { 
  $(this).children('ul').addClass("open"); 
});

Answer 3

您使用的是错误的课程

$(".view").click(function () {
    $(this).children().addClass("open");
});

Answer 4

更方便，更短的方式是 -

$('.view').click(function(){
  $('>ul',this).addClass('open');                     
});

Example

动态地为孩子添加课程

4 个答案: